Kako ubaciti CSS komentar

Uključujući komentare u vaš CSS kod je korisno i veoma preporučljivo.

Svaka web stranica je sastavljena od strukturnih elemenata (koje diktira HTML), kao i vizuelnog stila ili "izgleda i osećaja" tog sajta. Kaskadni stil listovi (CSS) su ono što se koristi za diktiranje vizuelnog izgleda web stranice. Ovi stilovi se čuvaju odvojeno od HTML strukture kako bi se omogućilo lakše ažuriranje i poštovanje Web standarda.

S obzirom na veliku složenost mnogih web lokacija danas, stilski listovi mogu brzo postati prilično dugačak i veoma oprijemljiv za rad. Ovo je posebno tačno kada počnete da dodate u medijske upite za odgovarajuće stilove veb sajta . Ti medijski upiti samo mogu dodati značajan broj novih stilova CSS dokumentu i učiniti ga još težim za rad. Ovdje komentari CSS-a mogu postati neprocjenjiva pomoć na web stranici.

Dodavanje komentara CSS datotekama veb sajta je odličan način dodavanja strukture dijelovima tog koda za čovjeka koji čita dokument koji pregledava. Takođe je izvanredan način objašnjavanja tih stilova za web profesionalca koji će možda morati raditi na sajtu u budućnosti - uključujući i sebe!

Na kraju, pametno dodati komentare CSS učinit će vam stilski list lakšim procesom. Ovo je, zaista, važno za stilske listove koje će urediti timovi. Komentari se mogu koristiti za prenos važnih aspekata lista stila različitim članovima tima koji već možda nisu upoznati sa kodom. Ovi komentari mogu biti od velike koristi i za ljude koji su ranije radili na ovoj lokaciji, ako se vraćaju u šifru nakon što neko vrijeme odustanu od njega. Često sam morao urediti web stranicu koju sam izgradila mjesecima ili čak i ranijim godinama, a dobro oblikovani komentari u HTML i CSS su dobrodošla pomoć! Zapamtite, samo zato što ste izgradili sajt ne znači da ćete se setiti zašto ste učinili stvari koje ste uradili kada se vraćate na to mjesto u budućnosti! Komentari mogu učiniti vaše namjere jasnim i razjasniti sve nesporazume prije nego što se čak desi.

Jedna stvar za razumevanje o komentarima CSS-a jeste da se oni ne prikazuju kada se stranica prikazuje u veb pregledačima. Ovi komentari su samo informativni, baš kao što su komentari HTML (iako je sintaksa različita između ove dve). Ovi komentari CSS-a ne utiču na vizuelni prikaz stranice na bilo koji način i jednostavno su prisutni u samom šifri.

Dodavanje CSS komentara

Dodavanje CSS komentara je prilično lako. Jednostavno rezervišete svoj komentar sa tačnim oznakama za otvaranje i zatvaranje komentara:

Sve što se pojavljuje između ove dve oznake biće sadržaj komentara, vidljiv samo u kodu, a ne pretraživač.

Komentar CSS-a može biti jedna linija, ili može da preuzme više linija. Evo primera jedne linije:

div # border_red {border: thin solid red; } / * crveni granični primjer * /

I višestruki primer:

/ *************************** ********************** ****** Stil za kodni tekst **************************** ************ *************** /

Prekidanje odlomaka

Jedan od načina na koji često koristim CSS komentare jeste da organizujem svoj stilski stil u manjim, lakšim delovima. Volim da mogu lako da vidim ove odeljke kada pregledam datoteku kasnije. Da bih to učinio, često dodam komentare sa puno crtica u njima tako da oni pružaju velike, očigledne pauze na stranici koja je lako vidjeti dok brzo skrolujem kroz kod. Evo primera:

/ * ----------------------- Stilovi zaglavlja ----------------------- ------- * /

Kada vidim jedan od ovih komentara u mom kôdu, znam da je to početak novog odeljka tog dokumenta, omogućavajući mi lakše obrade i korištenja koda.

& # 34; Komentarisanje Out & # 34; Kod

Oznake za komentare mogu takođe biti korisne u stvarnom procesu kodiranja i debagovanja stranice. Komentari se mogu koristiti za "komentarisanje" ili "isključivanje" oblasti tog koda kako bi videli šta se događa ako taj odjeljak nije dio stranice.

Kako to funkcioniše? Pa, zato što tagovi komentara govore pretraživaču da ignoriše sve između njih, možete ih koristiti da privremeno onemogućite određene dijelove CSS koda. Ovo može biti korisno prilikom otklanjanja grešaka ili prilikom prilagođavanja formatiranja Web stranica.

Da biste to uradili, jednostavno biste dodali tag za otvaranje komentara u kome želite da kôd počne da bude onemogućen, a zatim postavite tu završnu oznaku gde želite da se deo sa ograničenim pristupom završi. Sve između tih oznaka neće uticati na vizuelni prikaz lokacije, omogućavajući vam otklanjanje CSS-a da biste videli gde se problem može desiti. Zatim možete da uđete i popravite samo to pitanje i uklonite komentare sa koda.

CSS-ovi komentari

Kao recap, evo nekoliko saveta koje treba zapamtiti za korištenje komentara u CSS-u:

  1. Komentari mogu obuhvatiti više linija.
  2. Komentari mogu uključivati ​​CSS elemente koje ne želite pretraživati ​​od strane pretraživača, ali ne želite da ih potpuno izbrišete. Ovo je dobar način za debagovanje listova stilova web stranice - samo obavezno uklonite neiskorišćene stilove (za razliku od ostavljanja ih ostavili komentare) ako odlučite da ih ne trebate na veb lokaciji
  3. Koristite komentare kad god pišete komplikovane CSS da biste dodali pojašnjenja i informisali buduće programere ili sebe u budućnosti o važnim stvarima koje trebaju znati. Ovo će uštedeti buduće vrijeme razvoja za sve uključene.
  4. Komentari mogu uključivati ​​i meta informacije kao što su:
    • autor
    • datum kreiran
    • informacije o autorskim pravima

Performanse

Komentari sigurno mogu biti od pomoći, ali budite svjesni da što više komentara dodate u stilski list, on će postati viši, što će utjecati na brzinu prenosa i performanse sajta. Ovo je stvarna briga, ali ne biste se oklevali da dodate korisne i legitimne komentare zbog straha da će doživeti patnje. Linije CSS-a ne dodaju značajnu veličinu dokumentu. Morali biste dodati TONS linija komentara kako biste značajno uticali na veličinu CSS datoteke. Dodavanje prilika korisnih komentara u CSS ne bi trebalo da vam daje negativan uticaj na brzinu stranice.

Na kraju ćete želeti da pronađete ravnotežu između korisnih komentara i previše komentara kako biste dobili prednost i u vašim CSS dokumentima.

Originalni članak Jennifer Krynin. Uredio Jeremy Girard na 7/5/17