Cén fáth a simplíann coma simplí códáil
CSS, nó Bileoga Stíl Cascáideacha, ar ghlactar leis an tionscal dearadh gréasáin chun stíleanna amhairc a chur le láithreán. Le CSS, is féidir leat leagan amach an leathanaigh, dathanna, clóghrafóireacht , íomhá cúlra, agus i bhfad níos mó a rialú. Go bunúsach, más stíl amhairc é, is é CSS an bealach chun na stíleanna sin a thabhairt ar do láithreán gréasáin.
De réir mar a chuireann tú stíleanna CSS le doiciméad, féadfaidh tú a rá go dtosaíonn an doiciméad níos faide agus níos faide. Is féidir le suíomh beag ach le dornán de leathanaigh comhad CSS sizable a chríochnú - agus is féidir go mbeadh comhaid CSS an-mhór ag suíomh an-mhór le go leor leathanaigh d'ábhar uathúil. Tá sé seo níos measa ag suíomhanna sofhreagracha a bhfuil go leor fiosruithe sna meáin san áireamh sna bileoga stíl chun athrú a dhéanamh ar an tsúil a léiríonn na radharcanna agus an leathanaigh le haghaidh scáileáin éagsúla.
Is féidir, is féidir le comhaid CSS a bheith fada. Ní fadhb mhór é seo nuair a thagann sé le feidhmíocht an tsuímh agus luas a íoslódáil, toisc go bhfuil comhad fada CSS fiú beagán beag (ós rud é go bhfuil sé i ndáiríre ach doiciméad téacs). Mar sin féin, tá gach beagán ag brath nuair a thagann sé ar luas an leathanaigh, mar sin má is féidir leat do bhileog stíl a chothú, is smaoineamh maith é sin. Seo é an áit is féidir leis an "coma" teacht go héasca i do bhileog stíl!
Commas agus CSS
D'fhéadfá a fhiosrú cad é an ról atá ag an gcoma i gcomhréire roghnóir CSS . Mar atá i bpianbhreitheanna, tugann an coma soiléireacht-ní cód-leis na scaraitheoirí. Scaoileann an coma i roghnóir CSS il-roghnóir laistigh de na stíleanna céanna.
Mar shampla, féachaint ar roinnt CSS thíos.
th {dath: dearg; }
td {dath: dearg; }
p.red {dath: dearg; }
div # firstred {dath: dearg; }
Leis an gcomhréir seo, tá tú ag rá go bhfuil tú ag iarraidh clibeanna, clibeanna td , clibeanna mír leis an rang dearg, agus an clibe div leis an ID ar an gcéad dul síos go léir an dath stíl dearg.
Is CSS an-inghlactha é seo, ach tá dhá mhíbhuntáiste suntasach ann chun é a scríobh ar an mbealach seo:
- Sa todhchaí, má shocraíonn tú dath clóite na n-airíonna seo a athrú go gorm, caithfidh tú an t-athrú sin a dhéanamh ceithre huaire i do bhileog stíl.
- Cuireann sé a lán carachtair breise le do bhileog stíl nach gá duit. B'fhéidir nach cosúil go bhfuil overkill ar na 4 stíl seo, ach má leanann tú ar aghaidh ag déanamh é seo ar do bhileog stíl ar fad, cuirfidh na línte suas agus beidh an leathán sin i bhfad níos mó ná mar a chaithfidh sé a bheith.
Chun na míbhuntáistí seo a sheachaint, agus chun do chomhad CSS a shruthlíniú, déanfaimid iarracht comas a úsáid.
Ag Úsáid Coma do Roghnóirí Sealadach
In áit a scríobh 4 roghnóir CSS ar leithligh agus 4 rialacha, is féidir leat na stíleanna seo go léir a chomhcheangal i maoin riail amháin trí na roghnóirí aonair a scaradh le coma. Seo mar a dhéanfaí é sin:
th, td, p.red, div # firstred {dath: dearg; }
Gníomhóidh an carachtar cóga go bunúsach mar an focal "agus" taobh istigh den roghnóir. Mar sin, baineann sé seo le clibeanna AGUS clibeanna td AGUS clibeanna mír leis an rang dearg AGUS an clib div leis an ID ar dtús. Is é sin díreach cad a bhí againn roimhe seo, ach seachas rialacha 4 CSS a bheith ag teastáil, tá riail amháin againn le heilimintí éagsúla. Is é seo a dhéanann an choma sa roghnóir, cuireann sé ar ár gcumas go mbeadh go leor roghnóirí i riail amháin.
Ní hamháin go ndéanann an cur chuige seo do chomhaid CSS níos glaine, níos glaine, go ndéanann sé nuashonruithe sa todhchaí an oiread sin níos éasca. Anois má theastaigh uait an dath ó dearg go gorm a athrú, ní mór duit ach an t-athrú a dhéanamh in aon áit amháin seachas na rialacha 4 stíl bunaidh a bhí againn! Smaoinigh ar na coigilteas ama seo ar fud comhad CSS iomlán agus is féidir leat a fheiceáil conas a shábháilfaidh tú am agus spás sa rune fada!
Athrú Comhréire
Roghnaíonn cuid daoine an CSS a dhéanamh níos inléite trí gach roghnóir a dháileadh ar a líne féin, seachas é a scríobh go léir ar líne amháin mar atá thuas. Seo é mar a dhéanfaí é sin:
th,
td,
p.red,
div # firstred
{
dath: dearg;
}
Tabhair faoi deara go gcuirfidh tú coma tar éis gach roghnóra agus ansin "cuir isteach" a úsáid chun an chéad roghnóir eile a bhriseadh ar a líne féin. NÍ CHUN coma a chur leis an roghnóir deiridh.
Trí chomais a úsáid idir do roghnóirí, cruthaíonn tú bileog stíle níos dlúithe atá níos éasca a thabhairt cothrom le dáta sa todhchaí agus is furasta é a léamh inniu!
Airteagal bunaidh le Jennifer Krynin. Arna eagarthóireacht ag Jeremy Girard ar 5/8/17