Ngano nga ang usa ka yano nga comma nagpasimple sa coding
CSS, o Cascading Style Sheets, mao ang gidawat nga paagi sa industriya sa pagdisenyo sa web aron sa pagdugang sa mga estilo sa biswal sa usa ka site. Uban sa CSS, mahimo nimong kontrolon ang layout sa pahina, mga kolor, typography , hulagway sa background, ug daghan pa. Sa panguna, kung kini usa ka biswal nga estilo, unya CSS ang paagi sa pagdala sa mga estilo sa imong website.
Sa imong pagdugang sa mga estilo sa CSS ngadto sa usa ka dokumento, mahimo nimong mahibal-an nga ang dokumento nagsugod nga mas dugay ug mas taas. Bisan ang usa ka gamay nga site nga adunay pipila lamang ka mga panid mahimong mahuman sa usa ka dako nga file sa CSS - ug usa ka dako kaayo nga site nga adunay daghang mga panid sa talagsaon nga sulod mahimong adunay dako nga mga file sa CSS. Kini gipadaghan sa mga responsive nga mga site nga adunay daghan nga mga pangutana sa media nga gilakip sa style sheets aron mausab kung giunsa ang mga biswal nga tan-awon ug ang panid gibutang alang sa lain-laing mga screen.
Oo, ang mga file sa CSS mahimo nga taas. Kini dili usa ka mayor nga problema kon kini adunay kalampusan sa site ug download speed, tungod kay bisan ang usa ka taas nga CSS file lagmit nga gamay nga gamay (tungod kay kini usa lamang ka teksto nga dokumento). Bisan pa, ang matag usa ka gamay nga giisip sa diha nga kini moabut sa gikusgon sa panid, mao nga kung mahimo nimo ang imong style sheet nga mas luwas, maayo kana nga ideya. Dinhi diin ang "comma" mahimong magamit sa imong style sheet!
Mga koma ug CSS
Tingali nahibulong ka kung unsa ang papel nga gipakita sa comma sa CSS selector syntax. Sama sa mga tudling-pulong, ang koma nagdala og katin-awan-dili kodigo-ngadto sa mga separator. Ang comma sa usa ka selector sa CSS nagbahin sa daghang mga magpili sa sulod sa sama nga mga estilo.
Pananglitan, atong tan-awon ang pipila ka CSS sa ubos.
th {color: red; }
td {kolor: pula; }
p.red {color: red; }
div # firstred {color: red; }
Uban niini nga syntax, ikaw nag-ingon nga gusto nimo ang mga tag, mga tag sa tag, mga tag sa paragraph uban sa klase nga pula, ug ang tag sa div uban ang ID nga nagpabuto sa tanan aron mapula ang kolor sa estilo.
Kini mao ang hingpit nga madawat nga CSS, apan adunay duha ka mahinungdanon nga mga kahuyang sa pagsulat niini niining paagiha:
- Sa umaabot, kon ikaw modesisyon sa pag-usab sa kolor sa font niini nga mga kabtangan ngadto sa asul, kinahanglan nimo kining himoon nga upat ka beses sa imong style sheet.
- Nagdugang kini og daghan nga sobra nga mga karakter sa estilo sa estilo nga wala nimo kinahanglan. Kini nga mga estilo dili ingon og sobra, apan kon padayon nimo kini nga buhaton sa imong tibuok style sheet, ang mga linya makadugang ug kana nga panid mahimong dako, mas dako pa kay sa gikinahanglan niini.
Aron makalikay niining mga kahuyangan, ug aron mapadali ang imong CSS file, among sulayan ang paggamit sa mga koma.
Paggamit sa mga Komas sa mga Nagapili sa Pagpili
Imbis sa pagsulat 4 ka managlahing CSS selectors ug 4 nga mga lagda, mahimo nimong isagol ang tanang estilo ngadto sa usa ka pagmando nga kabtangan pinaagi sa pagbulag sa tagsa nga mga magpili nga adunay koma. Ania kung giunsa kini pagabuhaton:
th, td, pred, div # firstred {color: red; }
Ang comma nga kinaiya naglihok sa pulong nga "ug" sulod sa selector. Busa kini magamit sa t h tag AND td tags UG parapo tag uban sa klase nga pula UG ang div tag uban sa ID firstred. Mao gayud kana kaniadto, apan imbis nga gikinahanglan ang 4 nga mga lagda sa CSS, adunay usa ka lagda nga adunay daghan nga mga nagpili. Mao kini ang ginabuhat sa comma sa selector, kini nagtugot kanato nga adunay daghang magpapili sa usa ka lagda.
Dili lamang kini nga pamaagi nga gihimo alang sa mga leaner, mas limpyo nga mga file sa CSS, kini usab naghimo sa mas bag-o nga mga kasayuran nga mas sayon. Karon kung gusto nimong usbon ang kolor gikan sa pula ngadto sa asul, ikaw kinahanglan lamang nga magbag-o sa usa ka lugar imbis nga tabok sa orihinal nga 4 nga mga lagda nga anaa kanamo! Hunahunaa kini nga mga pagtipig sa panahon latas sa tibuok nga file sa CSS ug imong makita kung unsaon kini sa pagluwas kanimo sa panahon ug sa luna sa dugay nga panahon!
Pag-usab sa Syntax
Ang pipila ka mga tawo mipili sa paghimo sa CSS nga mas masabtan pinaagi sa pagbulag sa matag selector sa iyang kaugalingon nga linya, imbis nga isulat kini tanan sa usa ka linya sama sa ibabaw. Mao kini ang mahitabo:
ika,
td,
p.red,
div # firstred
Ang
kolor: pula;
}
Matikdi nga magbutang ka og koma pagkahuman sa matag selector ug dayon gamiton ang "pagsulod" aron sa pagputol sa sunod nga selector sa iyang kaugalingong linya. DILI ka makadugang sa koma pagkahuman sa katapusan nga tigpili.
Pinaagi sa paggamit og mga koma sa tunga sa imong mga nagpili, ikaw naghimo sa usa ka mas estrikto nga style sheet nga mas sayon ipabag-o sa umaabot ug mas sayon basahon karon!
Ang orihinal nga artikulo ni Jennifer Krynin. Gipamod ni Jeremy Girard sa 5/8/17