CSS, který ovlivňuje pouze aktuální dokument
Co jsou interní stylové listy
Vnitřní styly jsou styly, které jsou umístěny v dokumentu HTML . Tyto styly ovlivňují pouze dokument, ve kterém se nacházejí, a nemohou být odkazovány jiným webovým dokumentem.
Výhody interních stylů
- Interní styly se týkají pouze stránky, na které se nacházejí.
- Pokud pracujete na velkém webu a potřebujete testovat styly před jejich načtením na stránky jako celek, vnitřní listy stylů mohou být skvělým nástrojem. Umožňují vám otestovat styly v kontextu celého webu, aniž byste porušili jakoukoli stránku, než kterou testujete.
- Interní styly mohou používat třídy a ID.
- Na rozdíl od inline stylů mohou interní stylové listy stále využívat třídy, ID, sourozence a další vztahy mezi elementy.
- Interní styly nevyžadují nahrávání více souborů.
- To je obzvláště užitečné, když pracujete s věcmi, jako jsou e-maily nebo kiosky, kde máte k dispozici pouze jeden soubor HTML, který je lze upravit. Často používám inline styly, když si nejsem jistý, jaká by byla adresa URL, která by byla načtena do CMS - zachování stylů dokumentu znamená, že vím, jaké styly ovlivňují tento dokument.
- Interní styly mohou mít vyšší prioritu než externí stylové listy.
- To je závislé na objednávce načtení externích stylových listů. Webový vývojář stránky má kontrolu nad tím, kde budou vnitřní styly umístěny v hlavičce dokumentu. Jsou-li umístěny za odkazem na externí styly , budou mít v kaskádě vyšší přednost a překonat externí stylový list.
Nevýhody interních stylů
- Ovlivňují pouze stránku, na které se nacházejí.
- Chcete-li použít stejné styly v několika dokumentech, je třeba je opakovat pro každou stránku (nebo odkaz na externí stylový list ).
- Interní styly zvýší časy načtení stránky.
- Každá stránka, která má interní stylový list, musí načíst a analyzovat informace o style sheet při každém načtení stránky. Externí stylové listy jsou ukládány do mezipaměti prohlížečem - což zlepšuje dobu načítání pro každou stránku po načtení prvního.
Jak psát interní styl listu
živel:
- Otevřete dokument HTML ve webovém editoru .
- Do pole
Úplný interní styl štýlu by vypadal takto: