# data[].attributes.body
Tekst umieszczany na stronie pisany jest standardową czcionką. Możemy jednak to zmienić, formatując wygląd i wielkość czcionki. Znaczniki stosowane do tego celu można podzielić na dwie grupy: fizyczne i logiczne. Pierwsze wpływają bezpośrednio na czcionkę, np. pogrubiają ją, a drugie wpływają na wygląd tekstu, np. wyróżniają cytat lub fragment tekstu.

Znaczniki z grupy fizycznej to m. in. znaczniki <b>, <i>, <u>. Jeśli umieścisz tekst pomiędzy znacznikami <i> … </i>, to przeglądarka odwzoruje go jako pisany kursywą. Podobny efekt otrzymasz, gdy znacznik będzie miał postać <b> (styl pogrubiony) i <u> (styl podkreślony). Również tekst zawarty pomiędzy znacznikami <sup> i </sup> oraz <sub> i </sub> będzie zmodyfikowany, odpowiednio jako indeks górny i dolny

Aby wyróżnić niewielką ilość tekstu, należy użyć znaczników z grupy znaczników logicznych opisujących rolę, jaką pełni tekst na stronie internetowej (czy jest np. adresem), takich jak: <strong> lub <em>. Pierwszy z nich pogrubi czcionkę we fragmencie tekstu, a drugi spowoduje, że fragment tekstu będzie napisany czcionką pochyłą. Znaczniki te są nowym standardem w HTML5 i mają zastąpić stosowane we wcześniejszych standardach znaczniki <b> oraz <i> (ale na razie można ich zamiennie używać)

Z kolei, chcąc zacytować czyjąś wypowiedź, możesz skorzystać ze znacznika <blockquote> … </blockquote> oznaczającego cytat. Jego zawartością są całe akapity, oznaczone dodatkowym wcięciem tekstu

Informację o autorze możesz przedstawić w postaci tekstu wyświetlonego po nakierowaniu kursora na cytat. Efekt ten uzyskasz, jeżeli dodasz do znacznika <blockquote> atrybut title

# data[].attributes.body
Na początku dokumentu powinien znajdować się znacznik <!DOCTYPE html>. Nazywany jest definicją typu i może być użyty tylko raz, na samym początku pliku. Informuje on przeglądarkę, że nie jest to zwykły plik tekstowy, ale dokument HTML. Z kolei znacznik <html> występujący zaraz za definicją typu wskazuje początek właściwego dokumentu i jednocześnie deklaruje język, w którym dokument zostanie napisany. Na samym końcu znajduje się znacznik </html>, który wskazuje jego koniec. Pomiędzy tymi znacznikami znajduje się treść dokumentu, która podzielona jest na dwie części: nagłówek <head> i część główną, tzw. ciało <body>.

# data[].attributes.body
Nagłówek wyznacza początek strony i zawiera informacje o tytule dokumentu i jego autorze, rodzaju zastosowanego języka programowania, oraz odwołania do innych powiązanych stron i zasobów.

Jedynym widocznym elementem na stronie jest tytuł wyświetlany na górnym pasku okna przeglądarki. Zawartość tytułu jest wykorzystywana przez wyszukiwarki przy poszukiwaniu dokumentów w sieci. Tytuł umieszcza się w nagłówku, posługując się znacznikiem <title>.

# data[].attributes.body
Zaraz po sekcji nagłówka występuje sekcja <body> … </body>, w której znajduje się właściwa zawartość dokumentu. W niej umieścisz treści, zdjęcia i multimedia, wykorzystując znaczniki, ich atrybuty i wartości.

# data[].attributes.body
Żeby dodać tytuł i podtytuły w treści tworzonej strony, możesz skorzystać ze znaczników <h1>, <h2>, <h3>, <h4>, <h5> oraz <h6>. Nagłówek największy to <h1>, a najmniejszy to <h6>. Jeśli wiec tworzysz stronę WWW zawierającą artykuł, to do nadania mu tytułu możesz użyć znacznika <h1>. Nagłówki <h2> mogą wskazywać rozdziały, a <h3> podrozdziały. Tekst nagłówków jest pogrubiony.
Rozpoczynając pracę, zacznij od nagłówka pierwszego poziomu, umieszczając pomiędzy znacznikami <body> … </body> tytuł opisujący treść, którą chcesz zamieścić na stronie

# data[].attributes.body
Tekst w dokumencie pisany jest w akapitach pomiędzy znacznikami <p> … </p>. Akapity są domyślnie rozdzielane, podobnie jak nagłówki, pustą linią. Przeglądarki ignorują białe znaki (spacja, tabulacja, nowa linia), łącząc je w pojedynczą spację.
Tekst umieszczony między znacznikami <p> będzie przenoszony do następnej linii, kiedy na jej końcu zabraknie miejsca. Gdy zajdzie potrzeba przejścia do nowej linii wewnątrz akapitu, wykorzystuje się znacznik złamania linii <br/>.

# data[].attributes.body
Encje - w celu wstawiania w dokumencie różnych symboli możesz skorzystać z tzw. encji HTML. Encja HTML to specjalny zestaw znaków określających nazwę encji, poprzedzonych znakiem & (ampersand), np.: „&lt;” - mniejszy niż < (ang. less than), „&gt;” - większy od > (ang. greater than).

Gdy zamierzasz na stronie umieścić zdanie:

„Każda informacja tekstowa znajdująca się wewnątrz znaczników <pre> … </pre> uznawana jest za sformatowaną za pomocą białych znaków.”,

# data[].attributes.body
Język HTML5 pozwala grupować treści, wykorzystując do tego celu trzy rodzaje list:

nieuporządkowaną (punktową),

uporządkowaną (numerowaną),

definiowaną.
Listę punktową utworzysz używając znacznika <ul>, a listę numerowaną - używając znacznika <ol>. Wewnątrz list jedynym dopuszczalnym znacznikiem jest <li>. Tylko wewnątrz niego zawarte mogą być kolejne elementy listy. Zawartością znacznika <li> może być zarówno tekst, jak i kolejne listy, tzw. zagnieżdżone.

Aby uzyskać inny rodzaj wyróżnienia listy punktowej (standardowo kółko), należy użyć Kaskadowych Arkuszy Stylów (ang. Cascading Style Sheets, w skrócie CSS), o których dowiesz się później. Natomiast w listach uporządkowanych można zmienić sposób oznaczania elementów listy, korzystając z atrybutów type oraz start. Atrybut start pozwala na rozpoczęcie numeracji od dowolnej liczby. Istnieje możliwość zastosowania jednego z pięciu sposobów numerowania elementów listy:

type="A" - wielkie litery alfabetu (A, B, C, D),

type="a" - małe litery alfabetu (a, b, c d),

type="I" - wielkie cyfry rzymskie (I, II, III, IV),

type="i" - małe cyfry rzymskie (i, ii, iii, iv),

type="1" - cyfry arabskie.

# data[].attributes.body
Do wstawiania tabel w dokumentach HTML służą trzy podstawowe polecenia: <table>, <tr>, oraz <td>. Tworzenie tabeli rozpoczyna się od wpisania znacznika <table>, a następnie należy określić liczbę kolumn i wierszy. Wiersze tabeli zdefiniuj za pomocą znacznika <tr>, natomiast jej kolumny za pomocą znacznika <td>.

Każda tabela powinna mieć obramowanie. W HTML5 atrybut border pozwala zadecydować, czy obramowanie ma być włączone (border="1") czy wyłączone (border="*").

Nagłówek tabeli możesz utworzyć, stosując zamiast znacznika <td>, znacznik <th>, pogrubiający informacje zawarte w danej komórce.

Do tabeli możesz dodać również tytuł. Wystarczy, jeśli wewnątrz znacznika <table> umieścisz znacznik <caption>.

Prezentacja danych w tabelach wymaga często łączenia komórek w obrębie tego samego wiersza, bądź też wewnątrz pojedynczej kolumny. Służą do tego atrybuty colspan i rowspan, które można stosować w znaczniku <td>. Atrybut colspan powoduje, ze komórka powiększa się przez połączenie wskazanych kolumn z prawej strony. Wartością tego atrybutu jest liczba określająca, z ilu kolumn ma zostać złożona komórka. Atrybut rowspan powoduje, że komórka powiększa się przez połączenie wskazanych wierszy poniżej tej komórki. Wartością tego atrybutu jest liczba określająca, z ilu wierszy ma zostać złożona komórka.

# data[].attributes.body
Poza tekstem, na strony WWW możesz wstawić grafikę. Służy do tego znacznik <img> z atrybutem src, określającym nazwę pliku. Znacznik ten nie potrzebuje znacznika zamykającego. Wstawiana grafika powinna być zapisana w formacie GIF, JPG, PNG lub SVG (format stworzony do wykorzystania na stronach internetowych).

Grafika zostanie wyświetlona po lewej stronie względem otaczającego tekstu.

Istotne jest, aby znacznik <img> uzupełnić o atrybut alt, którego wartością jest tekst opisujący wstawioną grafikę. Będzie on przydatny wówczas, gdy przeglądarka nie będzie mogła odnaleźć źródła grafiki.

Warto dodać także atrybut title, który będzie wyświetlany w momencie, gdy najedziemy kursorem myszy na grafikę.

Kolejne atrybuty pozwalają na określenie wysokości (height) i szerokości (width) wczytywanej grafiki.

Nie należy używać tej możliwości jako podstawowego sposobu zmiany rozmiaru grafiki. Na stronie powinna być umieszczana grafika wcześniej przygotowana (skalowana) w programie graficznym.

Ponieważ znacznik <img> tworzy element wierszowy (liniowy), można umieścić kilka grafik obok siebie, w jednym wierszu. Ponadto w HTML5 istnieje znacznik <figure>, umożliwiający utworzenie kontenera (pojemnika) dla grupy grafik, które mogą otrzymać wspólny podpis definiowany za pomocą znacznika <figcaption>. Powinien on znajdować się wewnątrz znacznika <figure>.

# data[].attributes.body
Jak już zapewne wiesz, odnośniki (hiperłącza) to odsyłacze do innych stron internetowych. Połączenia definiowane są za pomocą znacznika rozpoczynającego <a> oraz kończącego </a>, wewnątrz których zawarte są informacje określające hiperłącza.

Odnośniki <a> mogą posiadać atrybut target, którego wartość blank mówi, że odnośnik otworzy się w nowym oknie, a wartość self, że odnośnik otworzy się w tym samym oknie.

Możesz również umieścić na stronie WWW ikonę grafiki, po wybraniu której ukaże się jej pełnowymiarowa wersja. Za pomocą omówionego już parametru target możesz określić okno przeglądarki, w którym ma się pojawić większa ilustracja.
Przykładowo, jeżeli chcesz otworzyć grafikę z podfolderu ilustracje w nowym oknie, przypisz atrybutowi target wartość _blank.

# data[].attributes.body
Jedną z przyczyn popularności sieci internet jest możliwość publikowania na stronach WWW dźwięków i klipów video. Aby przeglądaniu zawartości stron towarzyszył podkład muzyczny, należy użyć, wprowadzonego w HTML5, znacznika <audio> wraz z atrybutami <audio atrybuty>.

Pliki audio mogą być również wykorzystywane jako uzupełnienie informacji tekstowych prezentowanych na stronie. Za pomocą polecenia <a> i atrybutu href możesz utworzyć połączenie pomiędzy fragmentem tekstu (grafiki) i plikiem audio.

# data[].attributes.body
Kod źródłowy przedstawiony powyżej jest już kodem dość skomplikowanym. Gdy powrócisz do niego za jakiś czas, możesz zastanawiać się, dlaczego został napisany w ten sposób. Przydatne mogą być w takim przypadku komentarze, które wstawione w kod zostaną pominięte przez przeglądarkę przy wyświetlaniu strony internetowej, a będą widoczne w kodzie. Komentarze występują w każdym języku programowania, pomagając w ustaleniu np. czego dana część kodu dotyczy. W języku HTML komentarz wielolinijkowy umieszczany jest pomiędzy znacznikami <!- oraz ->.  Jednolinijkowy komentarz możesz również wstawić używając dwóch ukośników //.

# data[].attributes.body
Formularze umożliwiają przekształcenie stron WWW ze stron statycznych, biernie przeglądanych, w strony interaktywne.

Aby utworzyć formularz, zastosuj znacznik <form>. Otwierający znacznik zazwyczaj zawiera dwa atrybuty – method i action

Atrybut method określa metodę przesyłania danych do skryptu, który je obrabia. Stosowane są dwie metody get i post.Druga z nich jest stosowana wówczas, gdy formularz wysyła niewielką ilość danych na adres e‑mail.

Atrybut action jest pełnym adresem URL, pod który należy przesłać zawartość pól formularza, by otrzymać odpowiedź.