Komentáře se používají v CSS k vysvětlení bloku kódu nebo k dočasným změnám během vývoje. Komentovaný kód se nevykonává.
jednoduché i víceřádkové komentáře v CSS začínají /* a končí */ a do svého stylesheetu můžete přidat tolik komentářů, kolik chcete. Například:
/* This is a single line comment*/.group:after { content: ""; display: table; clear: both;}/* This is a multi-line comment*/své komentáře můžete také vylepšit stylizací:
ve větších projektech mohou soubory CSS rychle růst a obtížně se udržovat., To může být užitečné uspořádat vaše CSS do různých sekcí s tabulkou obsahu, aby bylo snadnější najít určitá pravidla v budoucnosti:
něco více o CSS: CSS Syntaxe a Selektory
Když mluvíme o syntaxi CSS, mluvíme o tom, jak se věci jsou stanoveny. Existují pravidla o tom, co se děje, kde, jak, takže si můžete psát CSS důsledně a program (jako prohlížeče), může interpretovat ji a aplikovat je na stránce správně.
existují dva hlavní způsoby zápisu CSS.,
Inline CSS
Podrobnosti o CSS Specifičnost: CSS Triky,
Inline CSS použije styl pro jeden prvek a jeho děti, dokud jiný styl převažující v první se setkáváme.
Chcete-li použít inline CSS, přidejte atribut „styl“ k prvku HTML, který chcete upravit. Uvnitř uvozovek obsahuje středník-oddělený seznam párů klíčů / hodnot (každý zase oddělený dvojtečkou) označující styly, které chcete nastavit.
zde je příklad inline CSS. Slova „jeden“ a “ dva “ budou mít barvu pozadí žluté a barvu textu červené., Slovo “ tři “ má nový styl, který převažuje nad prvním a bude mít barvu pozadí zelené a textové barvy azurové barvy. V příkladu jsme použití stylů <div> značky, ale můžete použít styl každého prvku HTML.
<div style="color:red; background:yellow"> One <div> Two </div> <div style="color:cyan; background:green"> Three </div></div>Vnitřní CSS
Při psaní inline styl je rychlý způsob, jak změnit jeden prvek, tam je více efektivní způsob, jak aplikovat stejný styl mnoha prvků stránky najednou.,
interní CSS má své styly zadané ve značce <style> a je vloženo do značky <head>.
zde je příklad, který má podobný účinek jako příklad“ inline “ výše, s výjimkou CSS byl extrahován do své vlastní oblasti. Slova „jeden“ a“dva“se budou shodovat s voličem div a budou červeným textem na žlutém pozadí., Slova „Tři“ a „Čtyři“ se bude rovnat div voliče příliš, ale budou také odpovídat .nested_div selektor, který se vztahuje na jakýkoliv HTML element, který odkazuje na tuto třídu. Tento konkrétnější volič přepíše první a nakonec se objeví jako azurový text na zeleném pozadí.
výše uvedené selektory jsou velmi jednoduché, ale mohou být poměrně složité. Například je možné použít styly pouze na vnořené prvky; to je prvek, který je dítětem jiného prvku.,
Tady je příklad, kde můžeme určit styl, který by měl být aplikován pouze na div prvky, které jsou přímým dítě další div prvky. Výsledkem je, že „Dva“ a „Tři“ se zobrazí jako červený text na žlutém pozadí, ale „One“ a „Čtyři“ zůstane nedotčena (a pravděpodobně černý text na bílém pozadí).
<style type="text/css"> div > div { color: red; background: yellow; }</style><div> One <div> Two </div> <div> Three </div></div><div> Four</div>Externí CSS
Všechny styl má svůj vlastní dokument, který je spojen v <head> tag. Přípona propojeného souboru je .css