Svako web mjesto sastoji se od strukturnih, funkcionalnih i stilskih elemenata. Kaskadni listovi stilova diktirati izgled ("izgled i dojam") web stranice. Ti se stilovi drže odvojeno od HTML strukture radi lakšeg ažuriranja i pridržavanja web standarda.
Problem s tablicama stilova
S veličinom i složenošću mnogih web mjesta danas, tablice stilova mogu postati prilično dugačke i glomazne. Ovaj je problem sada postajao sve složeniji medijski upiti za responzivni stilovi web stranica su važan dio dizajna, osiguravajući da web stranica izgleda onako kako treba bez obzira na uređaj. Samo ti medijski upiti mogu dodati značajan broj novih stilova CSS dokumentu, što ga čini još težim za rad. Upravljanje ovom složenošću CSS komentari mogu postati neprocjenjiva pomoć dizajnerima web stranica i programerima.
Komentari Dodajte strukturu i jasnoću
Dodavanjem komentara u CSS datoteke web mjesta organiziraju se dijelovi tog koda za ljudskog čitatelja koji pregledava dokument. Također osigurava dosljednost kada jedan web stručnjak nastavi tamo gdje drugi stane ili kada timovi ljudi rade na web mjestu.
Dobro oblikovani komentari prenose važne aspekte tablice stilova članovima tima koji možda nisu upoznati s kodom. Ovi su komentari korisni i za ljude koji su ranije radili na web mjestu, ali nisu nedavno; web dizajneri obično rade na mnogim web mjestima, a pamćenje strategija dizajna od jedne do druge je teško.
Samo za profesionalne oči
CSS komentari se ne prikazuju kada se stranica prikaže web preglednicima. Ti su komentari samo informativni, baš kao i HTML komentari jesu (iako je sintaksa drugačija). Ovi CSS komentari ni na koji način ne utječu na vizualni prikaz web mjesta.
Dodavanje CSS komentara
Dodavanje CSS komentara prilično je jednostavno. Rezervirajte svoj komentar ispravnim oznakama za otvaranje i zatvaranje komentara:
Započnite svoj komentar dodavanjem /* i zatvorite ga s */.
Sve što se pojavi između ove dvije oznake je sadržaj komentara, vidljiv samo u kodu, a preglednik ga ne prikazuje.
CSS komentar može zauzeti bilo koji broj redaka. Evo dva primjera:
/ * primjer crvenog obruba * /
div # border_red {
obrub: tanka jednobojna crvena;
}
/***************************
****************************
Stil teksta koda
****************************
***************************/
Izbijanje odjeljaka
Mnogi dizajneri organiziraju tablice stilova u male, lako probavljive dijelove koje je lako skenirati tijekom čitanja. Tipično ćete vidjeti komentare kojima prethode i slijede nizi crtica koji stvaraju velike, očite prelome na stranici koji se lako vide. Evo primjera:
/ * Stilovi zaglavlja * /
Ovi komentari ukazuju na početak novog odjeljka kodiranja.
Kod za komentiranje
Budući da oznake komentara poručuju pregledniku da ignorira sve između sebe, možete ih koristiti za privremeno onemogućavanje određenih dijelova CSS koda. Ovaj trik može vam biti pri ruci prilikom uklanjanja pogrešaka ili prilikom prilagođavanja oblikovanja web stranica. U stvari, dizajneri ih često koriste za "komentiranje" ili "isključivanje" područja koda kako bi vidjeli što se događa ako taj odjeljak nije dio stranice.
Dodajte početnu oznaku komentara prije koda koji želite komentirati (onemogućiti); stavite završnu oznaku tamo gdje želite da završi onemogućeni dio. Ništa između tih oznaka neće utjecati na vizualni prikaz web stranice, pomažući vam u otklanjanju pogrešaka u CSS-u da biste vidjeli gdje se problem događa. Zatim možete ući i popraviti samo tu grešku, a zatim ukloniti komentare iz koda.
Savjeti za komentiranje CSS-a
Mnogi koderi uključuju blokove komentara na vrhu bilo koje nove datoteke s kodom. Oponašajte tu strategiju uključivanjem bloka komentara s vašim imenom, relevantnim datumima i povezanim informacijama za pomoć ljudi razumiju kontekst projekta, a ne samo odluke o tome što se događa u odnosu na određeni kod blok.