Baro Sawirrada Cascading Casriga ah Warqadan Xaashida CSS

Faahfaahinta guud ee Waraaqaha Cascading Style oo leh Warqadda Style Style

Markaad ka sameysid website ka soo xoqdo, waa mid caqli-gal ah in la bilaabo qaababka asaasiga ah ee la qeexay. Waxay u egtahay inaad ka bilowdo nadiif nadiif ah iyo burush cusub. Mid ka mid ah dhibaatooyinka ugu horreeya ee naqshadeeyayaasha webka waa waji waa in daalacashada webka ay dhamaantood kala duwan yihiin. Heerka font-ka ah ayaa ka duwan midka udhaxeeya min platformka, font font qoysku wuu ka duwan yahay, qaar ka mid ah daalacayaashu waxay qeexayaan marginsiyada iyo cidhib saarista jirka oo dhan marka ay kuwa kale sameeyaan, iyo wixii la mid ah. Hel agagaarahan is-khilaafaadka adigoo qeexaya qaababka caadiga ah ee bogaggaaga.

CSS iyo Set Charts

Waxyaabaha ugu horreeya marka hore, waxaad dhigataa astaamaha dukumiintigaaga CSS si aad uf-8 . Inkasta oo ay u badan tahay in boggaga badankood aad kuqoran tahay ay ku qoran yihiin Ingiriis, qaar baa laga yaabaa inay noqdaan kuwo ku-meel-gaar ah oo loogu talagalay jawiga luqadaha iyo dhaqamada kala duwan. Marka ay jiraan, utf-8 ayaa fududaynaya habka. Dejinta dabeecada ku jirta xaashida qaabka dibadda uma qaadan doonto hormarinta madaxa HTTP , laakiin xaaladaha kale oo dhan, waxay noqon doontaa.

Way sahlan tahay in la dejiyo sifooyinka gaarka ah. Laynka koowaad ee dokumentiga CSS qor:

@charset "utf-8";

Habkan, haddii aad isticmaasho jilayaasha caalamiga ah ee hantida ku jira ama sida fasalada iyo aqoonsiyada aqoonsiga, xaashida qaabka wali si sax ah ayey u shaqeyneysaa.

Isticmaalidda Jirka Page

Waxyaabaha xiga waa baahida qoraalka ah ee caadiga ah waa qaababka ay ku nadiifinayaan marginsyada, caanaha, iyo xuduudaha. Tani waxay hubineysaa in dhamaan daalacayaashu ay meel ku wada jiraan mowduucyo, mana jiraan wax qarsoodi ah oo u dhexeeya barta shabakada iyo maadada. Bogagga intarneedka intooda badan, tani waxay aad ugu dhowdahay cirifka qoraalka, laakiin waa muhiim in la bilaabo halkaa in sawirada asalka ah iyo qaybaha qaabeynta si sax ah loo safeeyo.

html, jirka {margin: 0px; caarada: 0px; xadka: 0px; }

Samee midab-dejinta hore ama midab-cad oo midabkiisu yahay madow iyo midabka caadiga ah ee caddaanka ah. Inkastoo tani ay u badan tahay in ay isbeddel ku sameyso naqshadeynta websaydhka intooda badan, adigoo haysta midabada caadiga ah ee ku jira jirka iyo HTML tag marka ugu horeysa bogga wuxuu sahlaa inuu akhriyo oo la shaqeeyo.

html, jirka [midabka: # 000; asalka: #fff; }

Astaanta Qoraalka

Heerka font-ka iyo font font-ka waa wax aad u baddali doona marka uu naqshaduhu qabanayo, laakiin ku billowda cabbirka font-ka ah ee 1 em iyo fontka qoysaska Arial, Geneva, ama font kale sans-serif. Isticmaalka ems sii hayso bogga sida ugu macquulsan, iyo font-ka sans-serif waa mid aad ugu habboon shaashadda.

html, jirka, p, th, td, li, dd, dt {font: 1em Arial, Helvetica, sans-serif; }

Waxaa jiri kara meelo kale oo aad ka heli karto qoraalka, laakiin p , th , t , li , dd , iyo dt waa bilaw wanaagsan oo lagu qeexayo font aasaasiga ah. Ku dar HTML iyo jirka oo kaliya marka la eego, laakiin daalacado badan ayaa ka hor istaagaya doorashooyinka font haddii aad kaliya ku qeexdid xarfahaaga HTML-ga ama jirka.

Tilmaamaha

Cinwaanada HTML waxay muhiim u yihiin in ay isticmaalaan si ay u caawiyaan qorshahaaga bogga oo u oggolow makiinadaha raadinta in ay si qoto dheer u galaan goobtaada. Iyadoo aan laheyn, dhammaantood waa kuwo si caddaalad ah, sidaa daraadeed qaababka caadiga ah ee ku saabsan dhamaantood oo qeexaya qoyska font iyo cabbirka xarfaha mid kasta.

h1, h2, h3, h4, h5, h6 {font-family: Arial, Helvetica, sans-serif; } h1 {font-size: 2em; } h2 {font-size: 1.5em; } h3 {font-size: 1.2em; } h4 {font-size: 1.0em; } h5 {font-size: 0.9em; } h6 {font-size: 0.8em; }

Diyaarso "Xayeysiiya Xiriirrada

Isticmaalida midabada midabku waa marwalba qayb muhiim ah ee naqshadeynta, laakiin haddii aanad ku qeexin qaababka caadiga ah, fursadaha waa inaad iloobi kartaa ugu yaraan mid ka mid ah fasalada kale. Ku qeex iyaga oo leh kala duwanaansho yar oo buluug ah ka dibna ka baddel markaad haysato palette midab leh goobta lagu qeexay.

Si aad u dejisid xirafadaha midab buluug ah, waxaad dhigtaa:

sida ku cad tusaalahan:

a: link {color: # 00f; } a: booqday {midabka: # 009; } a: hover {color: # 06f; } a: midab firfircoon {mid: # 0cf; } Marka la isku xiro xiriirka leh nidaam midab aan caadi aheyn wuxuu hubiyaa inaanan ilaawi doonin mid ka mid ah fasalada, sidoo kale wuxuu ka dhigayaa wax yar oo ka sarreeya buluug, casaan, iyo guduud.

Xaashida Macluumaadka oo buuxa

Halkan waa qoraalka qaabka buuxa:

@charset "utf-8"; html, jirka {margin: 0px; caarada: 0px; xadka: 0px; midabka: # 000; asalka: #fff; } html, jirka, p, th, td, li, dd, dt {font: 1em Arial, Helvetica, sans-serif; } h1, h2, h3, h4, h5, h6 {font-family: Arial, Helvetica, sans-serif; } h1 {font-size: 2em; } h2 {font-size: 1.5em; } h3 {font-size: 1.2em; } h4 {font-size: 1.0em; } h5 {font-size: 0.9em; } h6 {font-size: 0.8em; } a: link link {color: # 00f; } a: booqday {midabka: # 009; } a: hover {color: # 06f; } a: midab firfircoon {mid: # 0cf; }