CSS trumpasis ir ilgasis režimas - kada naudoti
Trumpas ir ilgas - trumpas ir kitas tikslus. Vienas atsirado iš noro, kad būtų trumpesnis, o kitas - tvirtai išlaikęs aiškumą. Bet kokiu atveju jie turi savo tikslus, privalumus ir trūkumus.
Šis pranešimas atspindės tiek „CSS“ trumpųjų pastabų, tiek „longhand“ žymėjimų, tuo pačiu metu nuspręsdamas, kuris iš jų geriausiai tinka, kuriai situacijai.
Kas yra trumpaplaukė nuosavybė?
Trumpalaikis turtas yra nuosavybė, kuri atsižvelgia į kitų CSS savybių rinkinių reikšmes. Pavyzdžiui, galime priskirti vertę sienos plotis, sienos stilius ir sienų spalva naudojant sienos nuosavybė.
Iš esmės,
siena: 1vnt. mėlyna;
yra toks pat kaip:
sienos plotis: 1px; sienos stilius: kietas; sienos spalva: mėlyna;
Todėl nereikia atskirai atskirti atskirų turto vertybių (tai yra nereikalinga, laiko ir erdvės). Ji taip pat atkuria deklaracijoje likusias išvesties savybes, kurios gali būti panaudotos.
Kaip tai veikia?
Kaip ir anksčiau minėjome, mes trumpai įrašome kitų nuosavybės vertybių rinkinį, o užsakymas nesvarbu, ar visos turto vertės yra trumposios eilutės yra kitokio pobūdžio patinka sienos. Dėl savybių su panašių vertybių kaip marža, tai yra svarbu. Jei abejojate, prisiminkite laikrodžio rodyklę!
Ką daryti, jei deklaracijoje praleisime turtą ar du? Pirmiau pateiktame pavyzdyje, tarkime, mes ignoravome sienos stilius.
siena: 1px mėlyna;
Nebegalėsime matyti sienų, o ne todėl, kad stenografinis turtas neveikė, bet dėl to, kad sienos stilius mes palikome, turėjome numatytąją vertę nė vienas. Tokiu būdu suteikta ši trumpoji nuosavybė.
siena: 1px nėra mėlynos;
Dabar palikime 1px dėl sienos plotis ir laikykite kitus du:
siena: kieta mėlyna;
Galėsime pamatyti sienas, tik su storesnio pločio ir todėl, kad sienos plotis nuosavybė gavo numatytąją vertę terpėje.
siena: vidutinio kietumo mėlyna;
Tai mums tai daro kai palikta turto vertė į trumpąją deklaraciją, kad nuosavybė prisiima numatytąją vertę (net jei ji turi pakeisti bet kokią ankstesnę tą pačią vertę).
Jeigu ten yra sienos plotis: 1px; elementui kažkur anksčiau siena: kieta mėlyna; tuo pačiu atveju bus pasienio plotis terpėje (numatytoji vertė), ne 1px.
Kitas dalykas, kurį verta paminėti, yra tai, kad mes negalime naudoti tokių vertybių paveldėti, pradinis arba išjungta, kurios yra prieinamos visoms CSS savybėms, trumpuoju žymėjimu. Jei mes naudosime juos, naršyklė negalės tiksliai žinoti, kokią nuosavybės vertę turėtų atspindėti santraukoje - visa deklaracija bus atsisakyta.
The visi nuosavybė
Yra viena CSS stenograma, kuri gali nustatyti visų CSS savybių vertę. CSS visos vertės paveldėti, pradinis ir išjungta yra taikomos visoms savybėms, todėl jos yra vienintelės vertybės, kurias priėmė visi nuosavybė.
div all: original
Tai padarys div elementas ditch VISI CSS turtinių vertybių, kurias ji turėjo, ir iš naujo nustatykite numatytąją vertę kiekvienoje iš jų.
⚠ Įspėjimas
Negalime netinkamai naudoti visi nuosavybė. Jų poreikis gali atsirasti tik labai retomis aplinkybėmis, kai negalime paliesti ankstesnio CSS kodo elemento, kurį norime taikyti šiam turtui.
Pastaba: CSS nuosavybė spalva jei šešių reikšmių skaičius kiekviename spalvų kanale yra tas pats, naudoja heksadeciminę vertę su trumpuoju žymėjimu. Pavyzdžiui, fonas: # 445599; yra toks pat kaip fonas: # 459;.
Kas yra ilgalaikis turtas?
The atskirų savybių tai, kas gali būti įtraukta į trumpąją nuosavybę, vadinama „longhand“ savybėmis. Yra keletas pavyzdžių; fono vaizdas, margas kairėje, animacijos trukmė, ir kt.
Kodėl turėtume jį naudoti?
Nors trumpalaikės alternatyvos yra patogios, jos yra nepalankios. Atminkite, kad pradžioje matėme, kaip stenografija nepaiso jokių paliktų savybių su numatytomis reikšmėmis? Tai gali būti problema, jei nenorite iš naujo nustatyti.
Paimkite šriftą pavyzdžiui, trumpalaikis turtas. Panaudosime jį h4 elementas (turintis numatytąjį naršyklės stilių šrifto svoris: paryškintas)
šriftas: 20px "courier new";
Pirmiau pateiktame trumpojo kodo kode nėra jokios vertės šrifto svoris nuosavybė, taigi šrifto svoris: paryškintas(naršyklės numatytasis stilius) bus panaikintas pagal numatytąją vertę šrifto svoris: normalus sukelia h4 elementas praranda savo drąsią stilių, kuris galbūt nebuvo skirtas.
Taigi, aukščiau pateiktame pavyzdyje paprastos dvi ilgo turinio savybės, šrifto dydis ir šrifto šeima yra tobula.
Be to, naudodamiesi trumpu šriftu priskirti tik vieną ar dvi turto vertes nėra labai naudinga. Kodėl naršyklė turi papildomai dirbti, kad interpretuotų kiekvieną pavienį turtą (įskaitant kairiuosius), kai reikia dirbti tik vieną?
Gamybos panaikinimas, kūrimo etapo metu, kai kurie kūrėjai (ypač pradedantiesiems) gali lengviau dirbti su „longhand“ žymėjimu. geriau suprantamas ir aiškesnis.
Išvada
Šiuo metu su greito kodavimo galimybe (naudojant tokius įrankius kaip „Emmet“) ir minifikuojant, nereikia aukšto patikimumo, tačiau tuo pačiu metu yra logiška įvesti marža: 0;. Kontekstas, kuriame mes norėtume, kad mūsų CSS žymės būtų skirtingos ir viskas, ką turime padaryti, yra išsiaiškinti, kas žymiai veiks mums ir kada.
