Lo CSS si Zero Jade Agbegbe ati Awọn Aala rẹ

Oju-kiri ayelujara oni ti wa ọna ti o gun lati awọn ọjọ aṣiwèrè nibi ti eyikeyi iru iṣeduro agbelebu-kiri jẹ aifọwọyi fun ifẹkufẹ. Awọn aṣàwákiri wẹẹbù oni jẹ gbogbo awọn igbasilẹ-deede. Wọn ti ṣiṣẹ daradara ati ṣafihan ifihan iwe ti o ni ibamu deede awọn aṣàwákiri oriṣiriṣi. Eyi pẹlu awọn ẹya titun ti Google Chrome, Microsoft Edge, Mozilla Akata bi Ina, Opera, Safari, ati awọn aṣàwákiri oriṣiriṣi ti a ri lori ọpọlọpọ awọn ẹrọ alagbeka ti a lo lati wọle si aaye ayelujara loni.

Lakoko ti a ti ṣe ilọsiwaju nigba ti o ba de si awọn aṣàwákiri wẹẹbù ati bi wọn ti ṣe n ṣe afihan CSS, awọn ṣiṣiwọnyatọ si tun wa laarin awọn aṣayan software pupọ. Ọkan ninu awọn aisedede ti o wọpọ jẹ bi awọn aṣàwákiri wọn ṣe ṣayẹwo awọn agbegbe, awọn oju ipa, ati awọn aala nipasẹ aiyipada.

Nitori awọn abala wọnyi ti ifilelẹ ipa ti apoti ni gbogbo awọn ero HTML, ati nitori pe wọn ṣe pataki ni sisẹ awọn oju-iwe oju-iwe, ifihan ti ko ni iyatọ tumọ si pe oju-iwe kan le dabi ẹni nla ninu ẹrọ lilọ kiri ayelujara kan, ṣugbọn wo die diẹ ninu ẹlomiiran. Lati dojuko isoro yii, ọpọlọpọ awọn apẹẹrẹ oju-iwe ayelujara nṣe itọju awọn aaye yii ti awoṣe apoti. Ilana yii tun ni a mọ gẹgẹbi "sisẹ jade" awọn iye fun awọn agbegbe, awọn oju opo, ati awọn aala.

A Akọsilẹ lori Awọn aṣawari aṣàwákiri

Awọn aṣàwákiri wẹẹbu gbogbo ni awọn eto aiyipada fun awọn iṣẹ-ifihan ti oju iwe kan. Fun apeere, awọn hyperlinks jẹ buluu ti o si ṣe afihan nipasẹ aiyipada. Eyi ni ibamu pẹlu awọn aṣàwákiri orisirisi, ati biotilejepe o jẹ nkan ti ọpọlọpọ awọn apẹẹrẹ ṣe iyipada si awọn ohun elo oniru ti iṣẹ akanṣe wọn, ni otitọ pe gbogbo wọn bẹrẹ pẹlu awọn aṣiṣe kanna kanna jẹ ki o rọrun lati ṣe awọn ayipada wọnyi. Ibanujẹ, iye aiyipada fun awọn agbegbe, irọra, ati awọn aala ko gbadun ipele kanna ti agbelebu-kiri.

Deede Awọn idiyele fun Awọn aṣayan ati Padding

Ọna ti o dara julọ lati yanju iṣoro ti awọn apẹẹrẹ apoti ti ko ni ibamu ni lati seto gbogbo awọn agbegbe ati awọn iye ti o padding awọn ero HTML si odo. Awọn ọna diẹ ti o le ṣe eyi ni lati fi ofin CSS yii kun si ọna kika rẹ:

* Ala: 0; padding: 0; }

Ilana CSS yii nlo lilo * tabi ohun kikọ silẹ wildcard. Ti iwa naa tumọ si "gbogbo awọn eroja" ati pe yoo yan gbogbo awọn HTML ati ki o ṣeto awọn agbegbe ati awọn padding si 0. Bi o tilẹ jẹ pe ofin yii jẹ eyiti ko ni pato, nitori pe o wa ni iyatọ ti ita rẹ, yoo ni ipo ti o ga julọ ju aṣàwákiri aiyipada Awọn iṣiro ṣe. Niwon awọn aṣiṣe awọn ayanfẹ jẹ ohun ti o n ṣe atunkọ, ara yii yoo ṣe ohun ti o n ṣe eto lati ṣe.

Aṣayan miiran ni lati lo awọn ipo wọnyi si awọn eroja HTML ati ara. Nitoripe gbogbo awọn eroja miiran ti o wa ni oju-iwe rẹ yoo jẹ ọmọ ti awọn eroja meji, Ccade cascade yẹ ki o lo awọn ipo wọnyi si gbogbo awọn eroja miiran.

html, ara {ala: 0; padding: 0; }

Eyi yoo bẹrẹ aṣiṣe rẹ ni ibi kanna lori gbogbo awọn aṣàwákiri, ṣugbọn ohun kan lati ranti ni pe ni ẹẹkan ti o ba tan gbogbo awọn agbegbe ati iderun kuro, iwọ yoo nilo lati yan wọn pada fun awọn apakan pato ti oju-iwe ayelujara rẹ lati ṣe aṣeyọri ki o si lero pe awọn ipe apẹrẹ rẹ fun.

Awọn aala

O le wa ni ero "ṣugbọn awọn aṣàwákiri ko ni ààlà ni ayika ara ara nipa aiyipada". Eyi kii ṣe otitọ. Awọn ẹya agbalagba ti Internet Explorer ni ifihan iyipo tabi alaihan ti ayika awọn eroja. Ayafi ti o ba ṣeto ààlà si 0, iyọnu naa le jẹ idotin awọn ipilẹ oju-iwe rẹ. Ti o ba ti pinnu pe iwọ yoo tẹsiwaju lati ṣe atilẹyin awọn ẹya ti a ko ni idiwọn ti IE, iwọ yoo nilo lati koju eyi nipa fifi nkan wọnyi si ara rẹ ati awọn aza HTML:

HTML, ara {
ala: 0px;
padding: 0px;
aala: 0px;
}

Gegebi bi o ti pa awọn ala ati awọn padding, ọna tuntun yii yoo tun pa awọn aala aiyipada. O tun le ṣe ohun kan naa nipa lilo aṣaniyan ti o wa ni akọsilẹ ti o han ni iṣaaju ninu akọsilẹ.

Atilẹkọ article nipasẹ Jennifer Krynin. Edited by Jeremy Girard lori 9/27/16.