notatnik.net.pl

Osadzanie CSS w dokumencie HTML5

Piątek, 20.12.2013

W jaki sposób dodać style CSS do elementów w dokumencie HTML5? Są na to 3 sposoby:

Styl zewnętrzny.
Jest to najczęściej używany sposób. Dzięki niemu nie mamy niepotrzebnego kodu CSS w dokumentach HTML. Znajduje się on w oddzielnym pliku. Abu dodać zewnętrzny plik CSS musimy w nagłówku <HEAD> w dokumencie HTML5 dodać: <link rel="stylesheet" href="main.css" /> W HTML5, w odróżnieniu od poprzednich wersji, nie ma potrzeby deklarowania typu dołączanego pliku (type="text/css"). Powyższy kod jest wystarczający. W przypadku starszych wersji HTML, lub w XHTML kod będzie wyglądał tak: <link rel="stylesheet" href="main.css" type="text/css" />
Styl wewnętrzny
Ten sposób osadzania styli wykorzystywany jest w przypadku pojedynczych stron HTML. Aby dodać wewnętrzny styl CSS w nagłówku <HEAD> strony wpisujemy: <style>
...
</style>
Tutaj tak samo jak w poprzednim przykładzie nie musimy podawać wartości type="text/css".
W linii
Z tego sposobu osadzania CSS w dokumencie HTML5 korzystamy tylko w przypadku pojedynczych elementów np: <div style="width: 300px;">...</div>

Zobacz też:

CSS: Wycentrowanie zdjęcia w pionieCSS: Jak zrobić wcięcie pierwszego wiersza w akapicie?CSS: zaokrąglona ramkaCSS: style dla elementu <hr>