Idi ti o rọrun fifa simplifies coding
CSS, tabi awọn Iwọn Style Style, jẹ ọna itẹwọgba ti oju-iwe ayelujara lati fi awọn awoṣe ojulowo si aaye kan. Pẹlu CSS, o le ṣakoso oju-iwe oju-iwe, awọn awọ, aworan kikọ , lẹhin aworan, ati pupọ siwaju sii. Bakannaa, ti o jẹ ara wiwo, lẹhinna CSS jẹ ọna lati mu awọn iru wọn si aaye ayelujara rẹ.
Bi o ṣe nfi awọn CSS kun si iwe-aṣẹ kan, o le ṣe akiyesi pe iwe naa bẹrẹ lati gun ati gun. Paapa aaye kekere kan pẹlu awọn oju-ewe diẹ ti awọn oju-iwe le pari pẹlu faili CSS ti o ni kiakia - ati aaye ti o tobi pupọ pẹlu ọpọlọpọ awọn oju-iwe ti akoonu ti o le ni awọn faili CSS pupọ. Eyi ni o ṣafọpọ nipasẹ awọn aaye idahun ti o ni ọpọlọpọ awọn ibeere ti igbasilẹ ti o wa ninu awọn awoṣe ara lati yipada bi awọn oju wiwo wo ati oju-iwe naa ti jade fun awọn iboju miiran.
Bẹẹni, awọn faili CSS le gba gigun. Eyi kii ṣe iṣoro pataki kan nigbati o ba de iṣẹ iṣẹ ojula ati gbigba iyara, nitori paapaa ipari CSS faili kan ni o le jẹ kekere (niwon o jẹ ọrọ gangan kan nikan). Ṣi, gbogbo awọn diẹ kekere ṣe pataki nigbati o ba de si iyara iwe, nitorina ti o ba le ṣe igbimọ ara rẹ, ti o jẹ imọran to dara. Eyi ni ibi ti "iwin" naa le wa ni ọwọ pupọ ninu iwe ara rẹ!
Commas ati CSS
O le ti ronu pe kini ipa ti o ṣiṣẹ ni CSS yiyan sita. Gẹgẹbi awọn gbolohun ọrọ, ipalara naa n mu iyọrawa han-kii ṣe koodu-si awọn ẹlẹpa. Iwọn ti o wa ninu ayanfẹ CSS pin awọn oniruru ọpọlọpọ laarin awọn aza kanna.
Fun apẹẹrẹ, jẹ ki a wo diẹ ninu awọn CSS ni isalẹ.
th [awọ: pupa; }
td {awọ: pupa; }
p.red {awọ: pupa; }
div # firstred {awọ: pupa; }
Pẹlu iṣeduro yii, o n sọ pe o fẹ awọn afihan, awọn aami afi, awọn akọle afiwe pẹlu awọ pupa, ati ami tag pẹlu ID faramọ gbogbo lati ni awọ pupa awọ.
Eyi jẹ itẹwọgba CSS daradara, ṣugbọn awọn idiyele meji ni o wa lati kọwe ni ọna yii:
- Ni ojo iwaju, ti o ba pinnu lati yi awọ awọ ti awọn nkan wọnyi pada si buluu, o ni lati ṣe iyipada ni igba mẹrin ninu iwe-ara rẹ.
- O ṣe afikun ohun kikọ silẹ pupọ si folda ara rẹ ti o ko nilo. Awọn iru 4 wọnyi le ma dabi ẹnipe o pọju, ṣugbọn ti o ba tẹsiwaju ṣe eyi kọja gbogbo ara rẹ, awọn ila yoo fikun-un ati pe iwe naa yoo jẹ Elo, Elo tobi ju o yẹ lati jẹ.
Lati le ṣego fun awọn drawbacks wọnyi, ati lati ṣe akopọ faili CSS rẹ, a yoo gbiyanju lati lo awọn aami-ika.
Lilo Awọn Komputa si Awọn Aṣayan Iyatọ
Dipo kikọ awọn olutọsọna CSS ti o yatọ 4 ati awọn ofin mẹrin, o le darapọ gbogbo awọn wọnyi aza sinu ofin-ofin kan nipa sisọ awọn olukọni kọọkan pẹlu iṣiro kan. Eyi ni bi o ṣe le ṣe:
th, td, p.red, div # firstred {awọ: pupa; }
Ẹya ihuwasi naa ni irọrun sise bi ọrọ "ati" inu ayanfẹ. Nitorina eyi ni a ṣe afihan awọn ami afihan T ati awọn akọle TD ati ipin lẹta afi pẹlu kilasi kilasi ATI ami tag pẹlu ID akọkọ. Eyi ni gangan ohun ti a ni tẹlẹ, ṣugbọn dipo ti nilo 4 Awọn ofin CSS, a ni ofin kan pẹlu ọpọlọpọ awọn olutọpa. Eyi ni ohun ti apẹrẹ naa ṣe ni oludari, o fun wa ni aaye lati ni awọn alakoso ọpọlọpọ ninu ofin kan.
Ko ṣe nikan ni ọna yii ṣe fun onirohin, awọn faili CSS ti o mọ, o tun mu awọn imudojuiwọn iwaju lọpọlọpọ. Bayi ti o ba fẹ lati yi awọ pada lati pupa si buluu, iwọ nikan ni lati ṣe iyipada ni ipo kan dipo ti o kọja awọn ofin ti ara 4 ti a ni! Ronu nipa awọn ifowopamọ akoko yi kọja gbogbo faili CSS ati pe o le wo bi eyi yoo ṣe gba ọ laye akoko ati aaye ninu igun gigun!
Iyipada iyatọ
Diẹ ninu awọn eniyan yan lati ṣe CSS diẹ sii legible nipasẹ yiya olukọni kọọkan lori ila tirẹ, dipo ti kọ gbogbo rẹ lori ila kan bi loke. Eyi ni bi o ṣe le ṣe:
th,
td,
p.red,
div # akọkọ
{
awọ: pupa;
}
Ṣe akiyesi pe o gbe ami kan lẹhin igbakeji kọọkan ati lẹhinna lo "tẹ" lati fọ asayan ti o tẹle ni pẹlẹpẹlẹ si ara rẹ. O ṣe KO fi ami kan sii lẹhin oluṣakoso ikẹhin.
Nipa lilo awọn apọn laarin awọn ayanfẹ rẹ, o ṣẹda iwe ti o jẹ diẹ ti o rọrun julọ ti o rọrun lati ṣe imudojuiwọn ni ojo iwaju ati pe o rọrun lati ka loni!
Atilẹkọ article nipasẹ Jennifer Krynin. Edited by Jeremy Girard lori 5/8/17