+- Forum hosting 4un.eu (http://www.4un.eu/forum)
+-- Dział: Inne (/Forum-Inne)
+--- Dział: Tworzenie stron (/Forum-Tworzenie-stron)
+---- Dział: HTML+CSS (/Forum-HTML-CSS)
+---- Wątek: Jak korzystać ze stylów w pliku html (/Thread-Jak-korzysta%C4%87-ze-styl%C3%B3w-w-pliku-html)
Jak korzystać ze stylów w pliku html - deros - 12-08-2012 11:49 PM
Ponieważ mój poprzedni wątek o stosowaniu formatowania tekstu za pomocą css wywołał dyskusje czy korzystać z css czy ze znaczników html postanowiłem omówić sposób włączania kodu css do plików html.
Zasadniczo korzysta się z css (arkuszy stylów) na trzy sposoby:
Pierwszy to tzw. dołączanie inline polega on na tym, że korzystamy ze znacznika, a po nim następuje opis stylu np:
Cytat:<p style="font-size: 10pt;">coś tam</p>ustawia rozmiar czcionki dla napisu coś tam na 10 punktów.
Oczywiście takie formatowanie przydaje się do pojedyńczych stron i przy dużych projektach formatowanie każdego kawałka strony bywa kłopotliwe.
Drugim sposobem jest umieszczenie opisu wyglądu strony tuż po znaczniku <title> tytuł</title>
wygląda to następująco:
Cytat:<title>Test</title>odtąd tekst napisany bez formatowania będzie wydrukowany na ekranie czcionką Tahoma o rozmiarze 12 punktów
<style>
P {
font-family:Tahoma; font-size: 12pt;
}
.kat {
font-family:Courier New; font-size: 14pt;
}
.mat {
font-family:Courier New; font-size: 16pt;
}
</style>
natomiast <p class="kat">napis kat</p> będzie wydrukowany czcionką Courier New o rozmiarze 14 punktów , a <p class="mat">napis kat</p> wyświetli się z rozmiarem 16 punktów.
Najważniejszą sprawą w arkuszach css jest trzeci sposób ich wstawiania do plików html, polega on na tym, że tworzymy osobny plik z rozszerzeniem .css np: utworzymy plik stylowo.css a w nim
Cytat:P {teraz tworzymy plik html niech to będzie plik index.html
font-family:Tahoma; font-size: 12pt;
}
.kat {
font-family:Courier New; font-size: 14pt;
}
.mat {
font-family:Courier New; font-size: 16pt;
}
a w nim po <title>index</title>
Cytat:<LINK REL="stylesheet" HREF="stylowo.css" TYPE="text/css">odtąd wszystkie znaczniki <p></p> w pliku index.html będą pisane czcionką tahoma o rozmiarze 12 punktów i do klas będziemy się mogli odowływac tak jak w drugiej metodzie wstawiania stylów
teraz możemy sobie utworzyc kilkanascie plików w ten sposób i dodając <LINK REL="stylesheet" HREF="stylowo.css" TYPE="text/css">
w każdym pliku będziemy mieli to samo formatowanie.
Wyobraźmy sobie, że znudził nam się wygląd strony z czcionką Tahoma i chcemy ją zmienic na np. Times New Roman wystarczy tylko edytowac plik stylowo.css i zastapic
Cytat:P {nowym wpisem
font-family:Tahoma; font-size: 12pt;
}
Cytat:P {odtąd na każdej stronie gdzie wstawiliśmy arkusz stylu stylowo.css zmieni się czcionka na Times New Roman.
font-family:Times New Roman ; font-size: 12pt;
}
Uwaga: należy pamiętac, że HREF="stylowo.css" informuje przeglądarke, że ten plik znajduje się w tym samym katalogu co plik html, jeżeli tak nie jest należy w to miejsce podac właściwy katalog gdzie umieściliśmy ten plik!!!