Unsaon Pagtukod og External Style Sheet

Paggamit sa CSS Site Wide

Ang mga website usa ka kombinasyon sa estilo ug istruktura, ug sa karon nga web, kini usa ka labing maayo nga praktis sa paghupot niining duha ka aspeto sa usa ka site nga bulag gikan sa usag usa.

Ang kanunay nga HTML mao ang naghatag sa usa ka site nga adunay gambalay niini. Sa unang mga adlaw sa Web, ang HTML adunay unod nga impormasyon. Ang mga elemento sama sa tag sa gisabod sa HTML code, nagdugang sa pagtan-aw ug pagbati sa kasayuran uban sa impormasyon sa estruktura. Ang pagbalhin sa mga sumbanan sa web nagduso kanamo sa pag-usab niini nga praktis ug sa pagduso sa tanang estilo sa impormasyon ngadto sa CSS o Cascading Style Sheets. Ang pagpadayon niini usa ka lakang, ang kasamtangan nga mga rekomendasyon mao nga imong gigamit ang nailhan nga usa ka "external style sheet" alang sa imong mga kinahanglan sa estilo sa website.

Mga Kaayuhan ug mga Disbentaha sa External Sheet

Usa sa labing maayo nga mga butang mahitungod sa Cascading Style Sheets mao nga mahimo nimo kining gamiton aron mapabilin ang imong tibuok nga site. Ang labing sayon ​​nga paagi sa pagbuhat niini mao ang pag-link o pag-import sa usa ka estilo sa gawas nga estilo . Kung gigamit nimo ang sama nga estilo sa estilo sa gawas alang sa matag pahina sa imong site, makasiguro ka nga ang tanan nga mga pahina adunay parehas nga estilo. Mahimo usab nimo nga mas sayon ​​ang paghimo og mga kausaban alang sa umaabot. Tungod kay ang matag panid mogamit sa sama nga estilo sa estilo sa gawas, ang bisan unsang pag-usab sa maong panid makaapekto sa matag pahina sa site. Mas maayo kini kay sa pag-usab sa matag panid sa tinagsa nga paagi!

Mga Kaayohan sa External Sheet

  • Makontrol nimo ang hitsura ug pagbati sa daghang mga dokumento sa usa ka higayon.
    • Kini mapuslanon gayud kung magtrabaho ka sa usa ka grupo sa mga tawo aron sa paghimo sa imong web site. Daghang estilo nga mga lagda mahimong lisud hinumdoman, ug samtang ikaw adunay usa ka giimprinta nga estilo nga giya, kini dili episyente ug lisud nga padayon nga gibalik kini aron mahibal-an kung ang panig-ingnan nga teksto isulat sa 12 puntos nga Arial nga font, o 14 ka punto nga kurog. Pinaagi sa pag-angkon sa tanang butang sa usa ka dapit, ug tungod kay kana nga dapit mao usab ang imong himoon nga mga pagbag-o, mahimo nimo nga mas sayon ​​ang pagmintinar.
  • Mahimo ka makahimo og mga klase sa mga estilo nga mahimong gamiton sa daghang lainlaing mga elemento sa HTML .
    • Kung kanunay ka mogamit sa usa ka estilo sa font aron paghatag og gibug-aton sa nagkalainlaing mga butang sa imong panid, mahimo nimo gamiton ang usa ka hiyas sa klase nga imong gipahimutang sa estilo sa imong estilo aron makita ug mabati kini, inay nga mahibal-an ang usa ka piho nga estilo alang sa matag pananglitan sa paghatag gibug-aton.
  • Mahimo nimong ipalimpyo ang imong estilo aron mahimong mas episyente.
    • Ang tanan nga mga pamaagi sa pag-grupo nga anaa sa CSS mahimong magamit sa external style sheets, ug kini naghatag kanimo sa dugang nga pagkontrol ug pagkalalom sa imong mga panid.

Mga Disadvantages sa External Style Sheets

  • Ang external style sheets makadugang sa panahon sa pag-download, ilabi na kon kini hilabihan ka dako. Tungod kay ang CSS file usa ka lain nga dokumento nga kinahanglang i-load, kini makaapekto sa performance aron mahimo ang pag-download.
  • Ang mga estilo sa eksternal nga mga pananglitan dali ra kaayo nga lisud isulti kung ang usa ka estilo wala na gigamit tungod kay kini dili makuha kon ang panid makuha. Ang hustong pagdumala sa imong mga file sa CSS importante, ilabi na kon daghang mga tawo ang nagtrabaho sa sama nga file.
  • Kon ikaw adunay usa ka single-page nga website, nga adunay usa ka external nga file alang sa CSS dili kinahanglanon tungod kay ikaw adunay usa lamang ka panid sa estilo. Daghan sa mga benepisyo sa eksternal nga CSS ang nawala kung ikaw adunay usa lamang ka pahina nga pahina.

Unsaon Paghimo sa usa ka External Style Sheet

Ang estilo sa eksternal nga mga panid gihimo pinaagi sa usa ka susama nga syntax sa pag-dokumento sa mga style sheets nga lebel. Bisan pa, ang tanan nga imong kinahanglan nga ilakip mao ang selector ug ang deklarasyon. Sama sa usa ka estilo sa estilo sa dokumento, ang syntax alang sa usa ka lagda mao ang:

selector {property: value;}

Luwasa kining mga lagda ngadto sa usa ka text file uban sa extension nga .css. Dili kini gikinahanglan, apan kini usa ka maayo nga kinaiya nga makasulod, aron ikaw makaila dayon sa imong style sheets sa listahan sa usa ka direktoryo.

Sa higayon nga ikaw adunay usa ka style sheet nga dokumento, kinahanglan nimo kining i-link sa imong mga Web page . Mahimo kini sa duha ka mga paagi:

  1. Pagdugtong
    1. Aron masumpay ang usa ka style sheet, imong gamiton ang tag sa HTML. Kini adunay mga kinaiya nga rel , type , ug href . Ang attribute sa rel nagsaysay kon unsa ang imong nalambigit (sa kini nga kaso usa ka stylesheet), ang matang nagtino sa MIME-Type alang sa browser, ug ang href mao ang dalan sa. CSS file.
  2. Pag-import
    1. Gamiton nimo ang usa ka naimprinta nga estilo sa estilo sulod sa usa ka estilo sa estilo sa lebel sa dokumento aron mahimo nimo nga i-import ang mga hiyas sa usa ka estilo sa gawas gawas nga dili mawala ang bisan unsang dokumento nga piho. Gitawag nimo kini sa susama nga paagi sa pagtawag sa usa ka naka-link nga style sheet, kinahanglan lamang kini tawgon sulod sa usa ka deklarasyon sa style level sa dokumento. Mahimo nimo nga ma-import ang daghang eksternal nga style sheets nga imong gikinahanglan aron mapadayon ang imong Web site.

Ang orihinal nga artikulo ni Jennifer Krynin. Gipamod ni Jeremy Girard sa 8/8/17