Programowanie stron WWW
ict-trainer.pl - © 2024 - Grzegorz Szyjewski
Zadanie 1
Widok kodu źródłowego przykładowej strony napisanej w jezyku HTML.


Podstawowe tagi HTML HTML tags
 
<b> pogrubienie <b>tekst pogrubiony</b> tekst pogrubiony
<u> podkreślenie <u>tekst podkreślony</u> tekst podkreślony
<i> pochylenie <i>tekst pochylony</i> tekst pochylony
<p> nowy paragraf <p>zawartość paragrafru 1</p><p>zawartość paragrafru 2</p>

zawartość paragrafru 1

zawartość paragrafru 2

<br /> nowa linia pierwszy wiersz <br /> drugi wiersz pierwszy wiersz
drugi wiersz
<hr /> pozioma linia <hr />
<a> hiperłącze (link) <a href="http://www.wneiz.pl">wyświetlany tekst</a> wyświetlany tekst
<img /> element graficzny <img src="http://ict-trainer.pl/images/img8.jpg" title="globe image" />
<li> element listy <li>element 1 </li>
  • element 1
  • <ol> lista numeryczna <ol>
       <li>element 1 </li>
       <li>element 2 </li>
    </ol>
    1. element 1
    2. element 2
    <ul> lista punktowana <ul>
       <li>element 1 </li>
       <li>element 2 </li>
    </ul>
    • element 1
    • element 2
    <div> element blokowy <div>element 1</div><div>element 2</div>
    element1
    element2
    <table> tabela - ogólna struktura <table>
       <tr>
          <td>cell 1.1</td>
          <td>cell 1.2</td>
          <td>cell 1.3 </td>
       </tr>
       <tr>
          <td>cell 2.1</td>
          <td>cell 2.2</td>
          <td>cell 2.3 </td>
       </tr>
    </table>
    cell 1.1 cell 1.2 cell 1.3
    cell 2.1 cell 2.2 cell 2.3
    <tr> tabela - wiersz
    <td> tabela komórka (wewnątrz wiersza)
    Tagi HTML ze stylem CSS
    <div style="background:#fff999;">zawartość obiektu 1</div>
    <div style="background:#f99999;">zawartość obiektu 2</div>
    zawartość obiektu 1
    zawartość obiektu 2
    Dwie połączone komórki (1.1 and 1.2)
    cell 2.1 cell 2.2

    Są pewne modyfikacje, ale to nie jest inna kierownica. Najważniejsze przyciski znajdują się po lewej stronie, gdzie mam łatwiejszy dostęp. Te mniej ważne są po prawej. Kierownicę jednak zawsze ustawiało się pod preferencje danego kierowcy. Łopatkę do zmiany biegów mam po lewej stronie, ale Williams zawsze dopuszczał taką możliwość. Tego akurat nie trzeba była dostosowywać - wytłumaczył Kubica wszelkie zmiany dotyczące jego kierownicy.

    więcej tagów HTML i ich dokładny opis TUTAJ
    Zadanie
    ________
    Utwórz nowy dokument HTML i zdefiniuj sekcję HEAD W dokumencie w sekcji BODY dodaj:
    - Teksty z paragrafami (<p></p>).
    - Pogrubienia dla wybranych słów.
    - Zmień niektóre słowa na podkreślone i pochylone jednocześnie.
    - Wstaw poziomą linię na swojej stronie.
    - Wstaw kilka słów każda w nowej linii.
    - Wstaw obraz który znajdziesz w Internecie.
    - Wstaw listę numerowaną z przynajmniej 5 pozycjami.
    - Wstaw 3 elementy blokowe (<div> </div>).
    - Wstaw tabelę z 3 wierszami i 4 komórkami. W ostatnim wierszu komórki powinny byc zgrupowane (połączone w jedną).
    - Postaraj sie zmienić krawędzie tabeli na cienką kropkowaną linię w kolorze czerwonym.