Paano Mag-post ng isang CSS Comment

Ang pagsasama ng mga komento sa iyong CSS code ay kapaki-pakinabang at lubos na inirerekomenda.

Ang bawat website ay binubuo ng mga elemento ng estruktural (na kung saan ay idinidikta ng HTML) pati na rin ang visual na estilo o "hitsura at pakiramdam" ng site na iyon. Ang Cascading Style Sheets (CSS) ay ang ginagamit upang magdikta ng visual na hitsura ng isang website. Ang mga estilo na ito ay pinanatiling hiwalay mula sa istraktura ng HTML upang pahintulutan ang kadalian ng pag-update at pagsunod sa mga pamantayan sa Web.

Sa laki ng pagiging kumplikado ng maraming mga website ngayon, ang mga estilo ng sheet ay maaaring mabilis na maging masyadong mahaba at napaka-mahirap na magtrabaho kasama. Totoo ito lalo na kapag nagsimula ka ng pagdagdag sa mga query sa media para sa mga tumutugon na mga estilo ng website . Ang mga query sa media na nag-iisa ay maaaring magdagdag ng isang makabuluhang halaga ng mga bagong estilo sa isang CSS na dokumento at ginagawa itong mas mahirap na magtrabaho kasama. Ito ay kung saan ang mga komento ng CSS ay maaaring maging isang napakamahalagang tulong sa isang website.

Ang pagdaragdag ng mga komento sa mga file ng CSS ng isang website ay isang mahusay na paraan upang magdagdag ng istraktura sa mga seksyon ng code na iyon para sa isang tao na mambabasa na sinusuri ang dokumento. Ito rin ay isang kahanga-hangang paraan para ipaliwanag ang mga estilo para sa isang propesyonal sa web na maaaring magtrabaho sa site sa hinaharap - kasama ang iyong sarili!

Sa dulo, ang maingat na idinagdag na mga komento sa CSS ay mas madaling maproseso ang estilo ng sheet. Ito ay, sa katunayan, mahalaga para sa estilo ng mga sheet na mai-edit ng mga koponan. Maaaring gamitin ang mga komento upang maipabatid ang mga mahahalagang aspeto ng style sheet sa iba't ibang mga miyembro ng pangkat na maaaring hindi pamilyar sa code na. Ang mga komentong ito ay maaari ding maging kapaki-pakinabang para sa mga taong nagtrabaho sa site bago kung bumalik sila sa code pagkatapos na malayo sa ito para sa ilang oras. Madalas kong na-edit ang isang website na aking itinayo buwan o kahit na taon na ang nakalilipas at ang mahusay na naka-format na mga komento sa HTML at CSS ay napakagandang tulong! Tandaan, dahil lamang na nagtayo ka ng isang site ay hindi nangangahulugan na matandaan mo kung bakit mo ginawa ang mga bagay na ginawa mo kapag bumalik ka sa site na iyon sa hinaharap! Ang mga komento ay maaaring gawing malinaw at malinaw ang iyong mga intensyon ng anumang hindi pagkakaunawaan bago mangyari ang mga ito.

Ang isang bagay upang maunawaan ang tungkol sa mga komento sa CSS ay hindi nila ipinapakita kapag nag-render ang pahina sa mga web browser. Ang mga komentong iyon ay impormasyon lamang, tulad ng mga komento sa HTML (bagaman ang syntax ay iba sa pagitan ng dalawa). Ang mga komento ng CSS ay hindi nakakaapekto sa visual na pagpapakita ng isang site sa anumang paraan at nakikita lamang sa code mismo.

Pagdagdag ng Mga Komento sa CSS

Madali madali ang pagdaragdag ng komento sa CSS. Nag-bookend mo lang ang iyong komento gamit ang tamang tag ng pagbubukas at pagsasara ng komento:

Ang anumang bagay na lumilitaw sa pagitan ng dalawang tag na ito ay ang nilalaman ng komento, makikita lamang sa code at hindi nai-render ng browser.

Ang CSS comment ay maaaring isang solong linya, o maaari itong tumagal ng maraming linya. Narito ang isang solong halimbawa ng linya:

div # border_red {border: thin solid red; } / * red border example * /

At isang halimbawa ng multiline:

/ *************************** ********************** ****** Estilo para sa code ng teksto **************************** ************ *************** /

Pagbabagsak ng mga Seksyon

Ang isa sa mga paraan na madalas kong ginagamit ang mga komento sa CSS ay ang ayusin ang aking estilo ng sheet sa mas maliit, mas madali ang mga chunks. Gusto kong madaling makita ang mga seksyon na ito kapag binabalitaan ko ang file sa ibang pagkakataon. Upang gawin ito, ako ay madalas na magdagdag ng mga komento sa maraming mga hyphens sa mga ito upang bigyan sila ng mga malalaking, halata break sa pahina na madaling makita bilang ako mabilis na mag-scroll sa pamamagitan ng code. Narito ang isang halimbawa:

/ * ----------------------- Mga Estilo ng Header ----------------------- ------- * /

Kapag nakita ko ang isa sa mga komento na ito sa aking code, alam ko na ito ang simula ng isang bagong seksyon ng dokumentong iyon, na nagpapahintulot sa akin na mas madaling proseso at gamitin ang code.

& # 34; Nagkomento Out & # 34; Code

Maaari ring maging kapaki-pakinabang ang mga tag ng komento sa aktwal na proseso ng coding at pag-debug ng isang pahina. Ang mga komento ay maaaring gamitin upang "magkomento" o "i-off" ang mga lugar ng code na iyon upang makita kung ano ang mangyayari kung ang seksyon na iyon ay hindi bahagi ng pahina.

Kaya paano ito gumagana? Well, dahil ang mga komento tag sabihin sa browser upang huwag pansinin ang lahat sa pagitan ng mga ito, maaari mong gamitin ang mga ito upang pansamantalang huwag paganahin ang ilang bahagi ng CSS code. Ito ay maaaring magamit kapag nag-debug, o kapag nag-aayos ng pag-format ng Web page.

Upang gawin ito, idagdag mo lamang ang tag na tagbukas na komento kung saan mo nais na simulan ang code na hindi pinagana at pagkatapos ay ilagay ang pagtatapos na tag kung saan mo gustong matapos ang pinagana ang bahagi. Ang lahat sa pagitan ng mga tag na iyon ay hindi makakaapekto sa visual na pagpapakita ng isang site, na nagbibigay-daan sa iyo upang i-debug ang CSS upang makita kung saan maaaring mangyari ang isang problema. Pagkatapos ay maaari kang pumunta sa at ayusin lamang ang isyu na iyon at alisin ang mga komento mula sa code.

Mga Tip sa Pagkomento sa CSS

Bilang isang pagbabalik-tanaw, narito ang ilang tip na dapat tandaan para sa paggamit ng mga komento sa iyong CSS:

  1. Ang mga komento ay maaaring sumasaklaw ng maraming linya.
  2. Ang mga komento ay maaaring magsama ng mga elemento ng CSS na ayaw mong i-render ng isang browser, ngunit ayaw mong ganap na tanggalin. Ito ay isang magaling na paraan upang i-debug ang mga style sheet ng isang website - tiyaking alisin ang hindi nagamit na mga estilo (kumpara sa pag-iwan ng mga komento) kung magpasya kang hindi mo kailangan ang mga ito sa website
  3. Gumamit ng mga komento tuwing nagsusulat ka ng kumplikadong CSS upang magdagdag ng paglilinaw at upang ipaalam sa mga nag-develop sa hinaharap, o sa iyong sarili sa hinaharap, tungkol sa mahahalagang bagay na dapat nilang malaman. Ito ay i-save ang hinaharap na oras ng pag-unlad para sa lahat ng kasangkot.
  4. Ang mga komento ay maaari ring isama ang impormasyon ng meta tulad ng:
    • may-akda
    • nalikha ang petsa
    • impormasyon sa copyright

Pagganap

Ang mga komento ay maaaring tiyak na kapaki-pakinabang, ngunit magkaroon ng kamalayan na ang higit pang mga komento na idaragdag mo sa isang style sheet, ang magiging mas mahabang panahon nito, na makakaapekto sa bilis ng pag-download at pagganap ng site. Ito ay isang tunay na pag-aalala, ngunit hindi ka dapat mag-atubiling magdagdag ng kapaki-pakinabang at lehitimong mga komento dahil sa takot na ang pagganap ay magdurusa. Ang mga linya ng CSS ay hindi magdagdag ng malaking sukat sa isang dokumento. Kakailanganin mong magdagdag ng TONS ng mga linya ng mga komento upang makagawa ng isang makabuluhang epekto sa laki ng CSS file. Ang pagdaragdag ng ilang mga kapaki-pakinabang na komento sa iyong CSS ay hindi dapat magbigay sa iyo ng isang netong negatibong epekto sa bilis ng pahina.

Sa katapusan, gugustuhin mong mahanap ang balanse sa pagitan ng mga kapaki-pakinabang na komento at masyadong maraming mga komento upang makuha ang mga benepisyo ng kapwa sa iyong mga dokumento sa CSS.

Orihinal na artikulo ni Jennifer Krynin. Ini-edit ni Jeremy Girard noong 7/5/17