Sida Loo Isticmaalayo Fasalada CSS-ka ee Cunug Kaliya

Adigu kuma xadidan hal fasal oo keliya oo CSS ah.

Calaamada Cascading Style (CSS) waxay kuu oggolaaneysaa inaad qeexdo muuqaalka elektarooniga ah adoo eegaya sifooyinka aad u adeegsanaysid qaybtaas. Sifooyinkani waxay noqon karaan midkood ama aqoonsi ama fasal iyo, sida dhammaan sifooyinka, waxay ku daraan macluumaad wax ku ool ah waxyaabaha ay ku xiran yihiin. Iyada oo ku xiran sifaha aad ku dartid sheyga, waxaad qori kartaa xulashada CSS si aad u dalbato qaababka muuqaalka muhiimka ah ee loo baahan yahay si loo gaaro aragtida iyo dareemida cutubka iyo website-ka guud ahaan.

Inkasta oo aqoonsiga ama fasalada kale ay u shaqeeyaan ulajeeddooda ah in ay u hoggaansamaan xeerarka CSS, hababka casriga ee casriga casriga ahi waxay jecel yihiin fasalada aqoonsiga, qayb ahaan, sababtoo ah ma ahan mid gaar ah oo si sahlan u shaqeynaya guud ahaan. Haa, waxaad weli ka heli doontaa goobo badan oo isticmaalaayo aqoonsiyada, laakiin sifooyinkaas ayaa loo adeegsanayaa si ka baxsan sidii hore oo kale marka fasalada ay qaadeen bogagga casriga ah ee casriga ah.

Fasallo kali ah ama dhowr ah oo ku jira CSS?

Xaaladaha intooda badan waxaad kuxirin kartaa hal dabeeco oo halbeeg ah, laakiin dhab ahaantii kuma koobna hal fasal si aad uhesho aqoonsi. Inkasta oo halbeeggu uu yeelan karo hal aqoonsi oo keliya, waxaad si buuxda u siin kartaa casharro badan oo kala duwan iyo, mararka qaarkood, sidan oo kale waxay sameyn doontaa boggaaga si sahlan oo muuqaal leh iyo mid aad u jilicsan!

Haddii aad u baahato inaad ku qorto dhowr fasal oo kala duwan, waxaad ku dari kartaa fasalada dheeraadka ah oo aad u kala soocaan meel bannaan.

Tusaale ahaan, cutubkani wuxuu leeyahay saddex fasal:

rukunkuna wuxuu heystaa bidix "> Tani waxay noqon kartaa qoraalka cutubka

Tani waxay dejinaysaa sadexda fasal ee soo socda ee ku qoran qoraalka:

  • Dambe
  • Soo bandhigay
  • Bidix

U fiirso meelaha u dhaxeeya mid kasta oo ka mid ah qiimaha fasalka. Meelahaas ayaa ah waxa ay u dhigmaa sida kala duwan, fasal shakhsi ah. Tani sidoo kale waa sababta ay magacyo fasalka ah u heli karaan boosas, sababtoo ah waxay sameynayaan inay u dhigtaan fasalo gooni ah.

Tusaale ahaan, haddii aad isticmaashay "roodhaaf-ku-daboolan" oo aan lahayn meel bannaan, waxay noqonaysaa mid halbeeg ah, laakiin tusaalaha kor ku xusan, halkaasoo saddexdan erey oo la kala sooco meel, waxay u dhigaan qiimaha shakhsiga. Waa muhiim in la fahmo fikraddan markaad go'aansato qiimaha fasalka si aad u isticmaasho bogaggaaga.

Markaad haysatid qiimaha fasalkaaga HTML, waxaad markaas u diri kartaa kuwan casharrada ku jira CSS-kaaga iyo isticmaal qaababka aad rabto inaad ku darto. Tusaale ahaan.

.pullquote {...}
.firta {...}
p.left {...}

Tusaalooyinkan, odhaahyada CSS iyo lamaanuhu waxay ku dhex jiri karaan jaangooyooyinka adag, taas oo ah sida qaababka noocaas ah loo adeegsan doono dooriyaha ku haboon.

Xusuusnow - haddii aad fasal u dhigato shey gaar ah (tusaale ahaan, p.left), waxaad weli u isticmaali kartaa qayb ka mid ah liiska fasalada; Si kastaba ha ahaatee, ogsoonow in ay saameyn doonto oo keliya waxyaalaha ay ku qoran yihiin CSS. Si kale hadii loo dhigo, qaabka p.left wuxuu ku dabaqi doonaa cutubyada fasalka tan iyo maadama aad dooratey in aad codsato "cutubyo leh qiimaha fasalka 'bidix'". Taas bedelkeeda, labada xul ee kale ee tusaalaha ah ma sheegaan halbeeg gaar ah, si ay u dalbadaan wax walbo oo isticmaala qiimaha fasalka.

Faa'iidooyinka kala duwan ee fasalada

Fasallo badan ayaa fududeyn kara in lagu daro saameyno gaar ah oo la xidhiidha unugyada iyada oo aan loo baahnayn in la abuuro qaab cusub oo loogu talagalay qaybtaas.

Tusaale ahaan, waxaa laga yaabaa inaad rabto inaad awood u yeelatid in aad si dhakhso ah u dhaqdhaqaajisid waxyaabaha muhiimka ah. Waxaad qori kartaa labo fasal oo midig oo bidix leh oo keliya leh: bidix; iyo dabool: xaq; in iyaga. Kadib, mar kasta oo aad leedahay alaab waxaad u baahan tahay inaad ku dul seexato, waxaad si fudud kuugu dari kartaa fasalka "bidix" liiska fasalka.

Si kastaba ha ahaatee, waxaa jira khad wanaagsan oo aad ku socon karto. Xasuuso in heerarka webku ay qeexayaan kala-takoorka qaabka iyo qaabdhismeedka. Qaab dhismeedka waxaa loo hirgeliyaa HTML iyadoo la eegayo qaabka CSS.

Haddii dukumiintigaaga HTML ay ka buuxsameen waxyaallaha oo dhan waxay leeyihiin magacyo fasalka sida "casaan" ama "bidix", kuwaas oo ah magacyo tilmaamaya sida calaamaduhu u eegaan halkii ay ka ahaan lahaayeen waxa ay yihiin, waxaad ka gudubtaa xadka u dhexeeya qaabka iyo qaabka. Anigu waxaan isku dayayaa in aan xaddido magacyadeyda aan-macquul ahayn ee ugu badan ee macquul ah sababahan.

Fasallo kala duwan, Semantics, iyo JavaScript

Faa'iido kale oo lagu isticmaalayo fasallo kala duwan waa in ay ku siiso fursado badan oo isdhexgal ah.

Waxaad fasax cusub u isticmaali kartaa agabyada hadda jira iyagoo adeegsanaya JavaScript iyada oo aan laga saarin mid ka mid ah fasallada koowaad. Waxaad sidoo kale isticmaali kartaa fasalo si aad u qeexdid semantics of element ah . Tani waxay ka dhigan tahay inaad ku dari karto fasallo dheeraad ah si aad u qeexdid waxa ay ka dhigan tahay micno ahaan. Tani waa sida Microformatka u shaqeeyaa.

Dhibaatooyinka kala duwan ee fasallada

Dhibaatada ugu weyn ee la isticmaalayo fasallo badan oo ku saabsan waxyaabahaaga ayaa ah in ay ka dhigi karto waxoogaa yar oo aan ku habooneyn in la eego oo la maareeyo wakhtiga. Way adkaan kartaa in la ogaado qaababka ay saameyn ku yeelanayaan sheyga iyo haddii waxqabad kasta ay saameyn ku yeeshaan. Qaar badan oo ka mid ah qaababka maanta la heli karo, sida Bootstrap, waxay isticmaalaan xoogaa waxtar badan oo kala duwan oo leh fasalo kala duwan. Koodhkaasi wuxuu ka bixi karaa gacanta oo adag yahay inuu si dhakhso ah ula shaqeeyo haddii aadan ka taxaddarin.

Markaad isticmaasho fasallo kala duwan, waxaad sidoo kale jogeysaa halista ah inaad haysato qaabka fasal hal fasal oo kale ah xitaa haddii aadan ku talagelin tan. Tani waxay markaa ka dhigeysaa mid adag in la ogaado sababahaaga aan loo adeegsan xitaa marka ay u muuqato in ay tahay.

Waxaad u baahan tahay inaad ka warqabto qaas ahaan, xitaa haddii sifooyinka lagu dabaqay hal element!

Adigoo isticmaalaya aalad sida qalabka Webmaster ee Chrome, waxaad si sahal ah u arki kartaa sida fasalladaadu u saameeyaan qaababkaaga iyo inaad ka fogaato dhibaatada qaababka iyo sifooyinka isku dhaca.

Maqaalka asalka ah ee Jennifer Krynin. Waxaa sameeyay Edited by Jeremy Girard on 8/7/17