docWięcej na http://www.kurshtml.boo.pl
download 
Reklamacja Transkrypt
Więcej na http://www.kurshtml.boo.pl
Struktura dokumentu HTML <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl"> //nagłówek domunetu <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-88592" /> <meta name="Description" content="Tu wpisz opis zawartości strony" /> <meta name="Keywords" content="Tu wpisz wyrazy kluczowe rozdzielone przecinkami" /> <title>Tu wpisz tytuł strony</title> </head> <body> Tu wpisuje się treść strony </body> </html> Znaczniki Poza zwykłym tekstem, na stronę możesz wprowadzić znaczniki (tzw. tagi). Znacznik jest to specjalny tekst, umieszczony w nawiasach ostrych, np.: <b>. Jest on częścią składni języka HTML i pozwala sterować wyglądem strony. Dzięki niemu możesz np. ustalić kolor tła, rodzaj formatowania tekstu, wstawić obrazek czy tabelę itd. Znacznik nie jest widoczny na ekranie, widoczne są tylko efekty jego działania (np. wstawienie obrazka). Istnieją znaczniki otwierające (np.: <b>) oraz zamykające (np.: </b>). Zauważ, że znacznik zamykający rozpoczyna się ukośnikiem (czyli znakiem: "/") i ma taką samą nazwę jak otwierający. Pomiędzy znacznikami otwierającym i zamykającym może znaleźć się jakiś tekst, który chcemy np. poddać formatowaniu Najważniejsze znaczniki i atrybuty Tekst <p>Treść akapit</p> <p align=”left”>akapit wyrównany do lewej</p> <p align=”right”>akapit wyrównany do prawej</p> <p align=”center”>akapit wyśrodkowany</p> <p align=”justify”>akapit wyjustowany</p> <br /> przełamanie linii <b>ten tekst będzie pogrubiony</b> <i>ten tekst będzie napisany kursywą</i> <u>ten tekst będzie podkreślony</u> <h1>Nagłówek 1</h1> <h2>Nagłówek 2</h2> … <h6>Nagłówek 6</h6> <hr size="y" width="x" color="kolor"/> y -grubość w px, x – długość w px, kolor – kolor np. #336699; Listy - nienumerowana <ul type="rodzaj"> <li>Punkt pierwszy</li> <li>Punkt drugi</li> <li>Punkt trzeci</li> </ul> Rodzaj: "disc" - (domyślny) – koło, "circle" – okrąg, "square" - wypełniony kwadrat Listy numerowane <ol type="rodzaj numeracji"> <li>Punkt pierwszy</li> <li>Punkt drugi</li> <li>Punkt trzeci</li> </ol> Rodzaj numeracji: "1" (domyślny) - numeracja według liczb arabskich, "I" - według dużych liczb rzymskich, "i" - według małych liczb rzymskich, "a" - według małych liter, "A" - według dużych liter Tabela <table> <tr> <td>komórka1.1</td> <td>komórka1.2</td> </tr> <tr><td>komórka2.1</td> <td>komórka2.2</td> </tr> </table> Odsyłacz (link) <a href="ścieżka dostępu" title="Do strony głównej">Tekst odsyłacz</a> Obrazek <img src="ścieżka dostępu" alt="Tekst alternatywny" /> Określanie stylu <selektor style="cecha: wartość; cecha2: wartość2…">…</selektor> Selektorem może być praktycznie dowolny znacznik, np. p (akapit), h1 (tytuł), td (komórka tabeli) i inne. To właśnie elementom znajdującym się pomiędzy tymi znacznikami, nadajemy atrybuty formatowania. Jako "cecha" czy inaczej własność bądź właściwość (ang. "property") należy wpisać o jakie konkretnie atrybuty formatowania nam chodzi (np. kolor tekstu - color). Opis wszystkich cech znajdziesz w następnych rozdziałach. Tutaj zajmiemy się tylko sposobami wstawiania stylów na stronach. Jako wyraz "wartość" (w deklaracji stylu) wpisujemy dokładną wartość atrybutu (np. dla koloru tekstu będzie to: red, blue czy też #31F4A5 itd.). Wartość zależy ściśle od cechy, po której stoi w deklaracji. Nie można przecież jako kolor tekstu podać np. left (bez sensu). font-size: 14px font-family: Arial, Verdana, color: red (lub w postaci kodu #335566) line-height: 5px background-color: green background-image: url(/images/obraz.jpg) margin: 5px 10px 8px 7px (góra, prawo, dół, lewo) padding: 5px (marginesy wewnętrzne po 5px) border-style: wartości atrybutów (dashed, solid, inne) border-width: 2px border-color: yellow width: szerokość height: wysokość Więcej na http://www.kurshtml.boo.pl
