Wstawianie stylów

Zwróć najpierw uwagę, że przeglądarka wyświetla strony pozbawione stylów autorskich, stosując własne, wbudowane w program style. Nowoczesne przeglądarki pozwalają użytkownikowi przemodelować style przeglądarki i wówczas to one obowiązują, gdyż są ważniejsze od domyślnych stylów przeglądarki. Natomiast gdy czytana strona zawiera style zdefiniowane przez jej autora, te właśnie style są uwzględniane w pierwszej kolejności podczas przeglądania strony, gdyż są jeszcze ważniejsze.

Style autora strony mogą być umieszczane w dokumencie na kilka sposobów:

• Kody formatujące są umieszczane w środku tekstu (styl lokalny, in-line style) i dotyczą wybranego znacznika dokumentu, jak p czy td.
• Kody formatujące są umieszczane w środku tekstu, obejmują większy fragment dokumentu i nie są związane z wybranymi znacznikami - rozciąganie stylu (span) i wydzielone bloki (div). Jest to de facto wariant stylu lokalnego.
• Kody formatujące są umieszczane na początku strony, w nagłówku head, i oddziałują na cały dokument (zagnieżdżanie stylu).
• Kody formatujące są umieszczane na wzorcowych stronach (tekstowe pliki z rozszerzeniem .css), a w dokumentach wstawiamy odpowiednie odwołania do tych stron, co powoduje automatyczne zmiany sposobu formatowania. Są to odwołania do tzw. stylów zewnętrznych.
• Kody formatujące są importowane z innej strony za pomocą polecenia @import.

Strona może zawierać informację o stylach z kilku źródeł jednocześnie, dlatego ważna jest relacja między nimi - przypomnij sobie od razu uwagi dotyczące kaskadowości stylów, czyli hierarchii stylów w danym dokumencie, pochodzących z różnych źródeł.

Generalna zasada: im styl jest bliżej miejsca w dokumencie, tym jest ważniejszy w hierarchii formatowania.

styl lokalny → styl zagnieżdżony → styl zewnętrzny → styl importowany