Každá webová stránka pozostáva z konštrukčných, funkčných a štylistických prvkov. Kaskádové štýly diktovať vzhľad („vzhľad a dojem“) webovej stránky. Tieto štýly sa udržiavajú oddelene od štruktúry HTML, aby sa uľahčila ich aktualizácia a dodržiavanie webových štandardov.
Problém so šablónami štýlov
Vzhľadom na veľkosť a zložitosť mnohých dnešných webových stránok môžu byť šablóny štýlov pomerne zdĺhavé a ťažkopádne. Teraz sa tento problém stal zložitejším mediálne dotazy pre responzívne štýly webových stránok sú podstatnou súčasťou dizajnu a zaisťujú, aby webová stránka vyzerala tak, ako má, bez ohľadu na zariadenie. Samotné tieto mediálne dotazy môžu do dokumentu CSS pridať značné množstvo nových štýlov, s ktorými je ešte ťažšie pracovať. Pri riešení tejto zložitosti sa komentáre CSS môžu stať neoceniteľnou pomocou pre návrhárov a vývojárov webových stránok.
Komentáre Pridajte štruktúru a jasnosť
Pridávanie komentárov k súborom CSS na webe organizuje časti tohto kódu pre ľudského čitateľa, ktorý dokument skontroluje. Zaisťuje tiež konzistenciu, keď jeden webový profesionál nastúpi tam, kde iný končí, alebo keď na webe pracujú tímy ľudí.
Dobre naformátované komentáre komunikujú dôležité aspekty šablóny so štýlmi členom tímu, ktorý nemusí byť oboznámený s týmto kódom. Tieto komentáre sú užitočné aj pre ľudí, ktorí na tomto webe pracovali už skôr, ale ešte nedávno; weboví návrhári zvyčajne pracujú na mnohých weboch a zapamätať si návrhové stratégie z jedného na druhý je ťažké.
Len pre oči profesionálov
Pri vykreslení stránky sa komentáre CSS nezobrazia webové prehliadače. Tieto komentáre majú iba informatívny charakter Komentáre HTML sú (aj keď syntax je iná). Tieto komentáre CSS nijako neovplyvňujú vizuálne zobrazenie stránky.
Pridávanie komentárov CSS
Pridanie komentára CSS je celkom jednoduché. Zarezervujte si svoj komentár správnymi otváracími a zatváracími značkami komentárov:
Začnite svoj komentár pridaním /* a zavri to */.
Čokoľvek, čo sa objaví medzi týmito dvoma značkami, je obsah komentára, ktorý je viditeľný iba v kóde a prehliadač ho nevykreslí.
Komentár CSS môže zaberať ľubovoľný počet riadkov. Tu sú dva príklady:
/ * príklad červeného okraja * /
div # border_red {
okraj: tenká plná červená;
}
/***************************
****************************
Štýl pre text kódu
****************************
***************************/
Prelomenie sekcií
Mnoho dizajnérov organizuje šablóny štýlov do malých, ľahko stráviteľných blokov, ktoré sa dajú pri čítaní ľahko skenovať. Spravidla sa zobrazia komentáre, za ktorými nasledujú a po nich nasleduje rad pomlčiek, ktoré na stránke vytvárajú veľké zjavné zlomy, ktoré sú dobre viditeľné. Tu je príklad:
/ * Štýly hlavičky * /
Tieto komentáre naznačujú začiatok novej časti kódovania.
Komentujúci kód
Pretože značky komentárov hovoria prehliadaču, aby ignoroval všetko medzi nimi, môžete ich použiť na dočasné deaktivovanie určitých častí kódu CSS. Tento trik môže byť užitočný pri ladení alebo pri úprave formátovania webových stránok. Dizajnéri ich v skutočnosti často používajú na „komentovanie“ alebo „vypnutie“ oblastí kódu, aby zistili, čo sa stane, ak táto časť nie je súčasťou stránky.
Pridajte úvodnú značku komentára pred kód, ktorý chcete komentovať (deaktivovať); umiestnite uzatváraciu značku na miesto, kde chcete ukončiť deaktivovanú časť. Nič medzi týmito značkami nebude mať vplyv na vizuálne zobrazenie webu, čo vám pomôže ladiť CSS a zistiť, kde sa problém vyskytuje. Potom môžete vojsť a opraviť iba túto závadu a potom odstrániť komentáre z kódu.
Tipy na komentovanie CSS
Mnoho kódovačov obsahuje bloky komentárov v hornej časti každého nového súboru s kódom. Napodobnite túto stratégiu zahrnutím bloku komentárov s vašim menom, príslušnými dátumami a súvisiacimi informáciami, ktoré vám pomôžu ľudia chápu kontext projektu, nielen rozhodnutia o tom, čo sa stane v súvislosti s konkrétnym kódom blokovať.