podstawy html czesc I, Kursy HTML+PHP+CSS+XHTML
[ Pobierz całość w formacie PDF ]
Poradnik HTML Część I
W dzisiejszym poradniku dowiecie się podstaw html
omówimy podstawowe tagi html oraz napiszemy własna stronę.
Edytory html
Na samym początku chciałem powiedzieć , że pisania strony
w notatniku nie ma sensu i zaproponuje wam program specjalny do tego.
Opisze tutaj jeden ponieważ opisywanie 10 programów nie ma sensu.
Notepad++
Program bardzo ciekawy używam tylko jego ponieważ bardzo przejrzysty
Podświetla składnie kodu,szybko się uruchamia, jest darmowy
Ramy dokumentu
Ramy dokumentu są to 3 tagi:
• <html> </html>
• <head> </head>
• <body> </body>
Tag
<html>
informuje przeglądarkę o rozpoczęciu programowania w html.
Tag
<head>
oznacza głowę dokumentu tam umieszczane są ważne informacje np.
kodowanie,meta.tytuł strony,skrypty JS, itp.
Tag
<body>
oznacza ciało dokumentu tam umieszczamy treść strony.
Oto jak przykładowo powinny wyglądać ramy każdego dokumentu w formacie HTML (istnieją również inne
podobne szablony):
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<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>
tesc strony
</body>
</html>
<title>Tu wpisz tytuł strony</title>
ten tag oznacza tytuł strony.
Po co są tagi
meta
do wiecie się w następnej części poradnika.
Podstawowe znaczniki HTML
Teraz omówimy podstawowe znaczniki html jest ich trochę.
Pogrubienie tekstu
Do pogrubienia tekstu używamy znacznika.
<b>
twój tekst
</b>
Podkreślenie tekstu
Do podkreślenie tekstu użyjemy znacznika.
<u>twój tekst</u>
Pochylenie tekstu
Do pochylenia tekstu używamy znacznika.
<i>
twój tekst
</i>
Następna linia
w html aby przejść do następnej linii używa się znacznika
<br>
Wielkość czcionki
Do zmiany rozmiaru czcionki używamy:
<font size="
x
">Tu wpisz tekst</font>
Gdzie x
należy wpisać wartość od 1 (czcionka najmniejsza) do 7 (czcionka największa).
Kolory czcionki
Aby zmienić kolor czcionki używamy znacznika:
<font color="
kolor
">Tu wpisz tekst</font>
Gdzie kolor wpisujemy nazwe koloru po ang. lub specjalny kod rgb #kod
Kolor tła strony oraz tekstu
Aby zmienić kolor tła strony oraz kolor tekstu użyj tego:
<body bgcolor="
kolor tła
" text="
kolor tekstu
">
Tu jest właściwa treść strony
</body>
Gdzie kolor tła oraz kolor tekstu podajemy kolory
Wstawiamy obrazek na stronę.
Aby wstawić obrazek użyj znacznika:
<img src="
Tu podaj względną ścieżkę dostępu do obrazka
" alt="
Tu podaj tekst
alternatywny
" />
Gdzie
Tu podaj względną ścieżkę dostępu do obrazka
podajemy adres obrazka na dysku lokalnym images/fotka.jpg
lub tez z adresu www z http.
Tu podaj tekst alternatywny
ten tekst pokazuje się po najechaniu myszą na obrazek.
Znacznik
<img/>
nie posiada w jezyku HTML znacznika zamykającego
Wyśrodkowanie elementu
Aby wyśrodkować element użyj znacznika:
<center> twój tekst wycentrowany</center>
Odsyłacz url
Aby odesłać internauta na naszej stronie do innej podstrony lub strony użyj:
<a href="
względna ścieżka dostępu do podstrony
">
opis odsyłacza
</a>
Gdzie względna ścieżka dostępu do podstrony podaj adres do podstrony (podstrony/1.html)
lub też bezwzględny adres www Z http. Gdzie opis odsyłacza wpisz jaką nazwe ma mieć link.
Odsyłacz e-mail
Znacznik mailto jest dobrym znacznikiem ale nie polecam w dzisiejszych czasach
ponieważ boty przysyłają na takie e-maile spam. Znacznik:
<a href="mailto:adres poczty e-mail">opis odsyłacza</a>
Działanie podobne jak odsyłacz url każdy wie chyba o co chodzi
z tym adres poczty e-mail.
Odsyłacz obrazkowy
Jak to działa? Po kliknięciu w obrazek przenosi cie pod podany adres
znacznik:
<a href="
adres
"><img src="
Tu podaj względną ścieżkę dostępu do obrazka
" alt="
Tu podaj tekst
alternatywny
" border="0"/></a>
Mam nadzieje ze każy wie o co z tym chodzi
Wszystkie znaczniki można ze sobą łaczyć np.
<b><u>
Cześć
</u></b>
[ Pobierz całość w formacie PDF ]