BeginnerZone
Style zewnętrzne
W tym poradniku zajmę się jedynie stylami zewnętrznymi, czyli umieszczonymi w innym pliku. Tworzymy nowy plik o rozszerzeniu *.css i wpisujemy do niego komendy. Podam tutaj przykład dla sekcji BODY:
BODY {
FONT-SIZE: 8pt;
FONT-WEIGHT: normal;
FONT-FAMILY: Verdana;
COLOR: white;
BACKGROUND-COLOR: black;
TEXT-DECORATION: none
}
Na początku podajemy znacznik, dla którego chcemy odwołać dany styl. Otwieramy nawias klamrowy. Podajemy właściwości, wstawiamy dwukropek i podajemy wartości. Po zakończeniu opisywania każdej właściwości należy postawić średnik, z wyjątkiem ostatniej wartości, którą kończy zamknięty nawias klamrowy. Tak wygląda wyrywek pliku css, który składa się z podobnych komend, jednak odnoszących się do różnych znaczników.
Najważniejszą rzeczą w całej tej zabawie jest wstawienie odpowiedniej komendy w pliku *.html, która pozwala komputerowi ustalić źródło, z którego ma pobierać właściwości styli. Jeżeli stworzyliśmy plik styl.css, należy wstawić następującą komendę w sekcji HEAD:
<LINK REL="stylesheet" TYPE="text/css" HREF="styl.css">
Pamiętajmy, aby plik css znajdował się w tym samym folderze, co pliki html. Nie będę się tutaj zagłębiał w dokładniejsze rozumienie stylów, w klasy i selektory, wystarczy, że wiemy, jak tworzy się style i jest to dość proste. Aby dowiedzieć się więcej o stylach, zajrzyj do Kursu CSS autorstwa Marcina Maciochy, który również znajduje się na tej witrynie.
Powyższy przykład odnosił się do już istniejącego znacznika w języku HTML. Ale możemy tworzyć własne, na przykład, jeżeli chcemy jeden akapit (P) wyróżnić spośród innych. Jeżeli do pliku css wstawimy opis stylu dla znacznika P, to wszystkie akapity będą miały takie właściwości. Ale możemy wstawić swój akapit, przed którego nazwą postawimy kropkę, np.:
.MOJ-AKAPIT {
FONT-SIZE: 8pt;
FONT-WEIGHT: normal;
FONT-FAMILY: Verdana;
COLOR: maroon
}
W pliku html musimy wstawić odwołanie w postaci:
<SPAN CLASS="moj-akapit">jakiś text</SPAN>
W naszym przypadku znajduje się ono między znacznikami P i /P. Możemy również wstawić to odwołanie w inny sposób:
<P CLASS="moj-akapit">jakiś text</P>
|
KURSY
