O ko ni opin si kilasi CSS kan kan fun ipinnu.
Awọn Apakan Awọn Iṣipa Ọpa (CSS) gba ọ laaye lati ṣafihan ifarahan ohun kan nipa sisọ sinu awọn ero ti o lo si iru nkan naa. Awọn eroja wọnyi le jẹ boya ati ID tabi kilasi ati, bi gbogbo awọn eroja, wọn fi alaye ti o wulo si awọn eroja ti wọn fi ṣopọ si. Ti o da lori iru iwa ti o fi kun si ẹri kan, o le kọ oluṣakoso CSS kan lati lo awọn ọna kika ojulowo ti a nilo lati ṣe aṣeyọri oju ati ki o lero fun ẹri yii ati oju-iwe ayelujara gẹgẹbi gbogbo.
Lakoko ti o jẹ ID tabi awọn iṣẹ kilasi fun idi ti sisọ sinu wọn pẹlu awọn ofin CSS, awọn ọna ẹrọ ayelujara ti ode oni ṣe afihan awọn kilasi lori Awọn ID, ni apakan, nitori pe wọn ko ni pato ati rọrun lati ṣiṣẹ pẹlu awọn ìwò. Bẹẹni, iwọ yoo tun ri ọpọlọpọ awọn aaye ti o lo ID, ṣugbọn awọn iru-ara wọn ni a ṣe lo diẹ sii ni idaniloju ju igba atijọ lọ nigba ti awọn kilasi ti ya lori awọn oju-iwe ayelujara ti ode oni.
Awọn Kọọkan tabi Awọn Kọọkan ni CSS?
Ni ọpọlọpọ awọn igba miiran iwọ yoo fi ipinnu kilasi kan si ipinnu kan, ṣugbọn iwọ ko ni opin si ẹgbẹ kan kan ti wọn nlo pẹlu ID. Lakoko ti o jẹ pe ohun kan le nikan ni idaniloju ID, o le funni ni awọn kilasi pupọ ati, ni awọn igba miiran, ṣe bẹẹ yoo jẹ ki oju-iwe rẹ rọrun si ara ati pe o rọrun julọ!
Ti o ba nilo lati fi awọn kilasi pupọ si ipinnu kan, o le fi awọn afikun afikun kun ati ki o yan wọn sọtọ pẹlu aaye ninu ipo rẹ.
Fun apẹrẹ, paragira yii ni awọn kilasi mẹta:
ere ti a fihan ni apa osi "> Eyi yoo jẹ ọrọ ti paragirafi
Eyi n seto awọn kilasi mẹta wọnyi lori paragilefi tag:
- Pullquote
- Ti fihan
- Osi
Akiyesi awọn aaye laarin awọn ọkan ninu awọn ipo kilasi wọnyi. Awọn agbegbe ni ohun ti o ṣajọ wọn soke bi o yatọ, awọn kilasi kọọkan. Eyi tun jẹ idi ti awọn orukọ kilasi ko le ni awọn alafo ninu wọn, nitori ṣiṣe bẹ yoo ṣeto wọn bi awọn kilasi ọtọtọ.
Fun apẹẹrẹ, ti o ba lo "ere-fifẹ-osi" laisi aaye kan, o jẹ iye-iye kan, ṣugbọn apẹẹrẹ loke, nibiti a ti pin awọn ọrọ mẹta wọnyi pẹlu aaye kan, ṣeto wọn bi awọn ipo ẹni kọọkan. O ṣe pataki lati ni oye itumọ yii bi o ṣe pinnu iru ipo ti o ṣe deede lati lo lori oju-iwe ayelujara rẹ.
Lọgan ti o ba ni iye awọn kilasi rẹ ni HTML, o le ṣe awọn wọnyi ni awọn kilasi ninu CSS rẹ ki o lo awọn aza ti o fẹ lati fi kun. Fun apere.
.pullquote {...}
.ofatured {...}
P.left {...}
Ni awọn apẹẹrẹ wọnyi, awọn ifọrọhan CSS ati awọn ifọri ifarahan yoo wa ninu awọn igbaduro iṣọ, eyi ti o jẹ bi awọn aza wọn yoo ṣe lo si ayanfẹ ti o yẹ.
Akiyesi - ti o ba ṣeto kilasi kan si ohun kan pato (fun apere, p.ft), o tun le lo o gẹgẹ bi apakan ti akojọ awọn kilasi; sibẹsibẹ, mọ pe oun yoo ni ipa lori awọn eroja ti o wa ni CSS nikan. Ni gbolohun miran, ọna kika ti yoo jẹ nikan si awọn paragirafi pẹlu ẹgbẹ yii niwọnyipe oluṣowo rẹ n sọ pe ki o lo o si "paragile pẹlu iwọn iye kan ti 'osi'". Ni idakeji, awọn oludari meji miiran ni apẹẹrẹ ko ṣe apejuwe kan pato, ki wọn yoo lo si eyikeyi awọn ohun elo ti o nlo awọn ipo kilasi naa.
Awọn anfani ti awọn kilasi pupọ
Awọn kilasi ọpọlọ le jẹ ki o rọrun lati fi awọn ipa pataki si awọn eroja lai ṣe lati ṣẹda titun ti ara tuntun fun irọ naa.
Fun apẹẹrẹ, o le fẹ lati ni agbara lati ṣatunṣe awọn ohun elo si apa osi tabi ọtun ni kiakia. O le kọ awọn kilasi meji ti osi ati ọtun pẹlu kan ṣan omi: osi; ati ṣifofo: ọtun; ninu wọn. Lẹhinna, nigbakugba ti o ba ni ipinnu kan ti o nilo lati lọ si osi, iwọ yoo fi kun "kilasi" naa si akojọ akopọ rẹ.
O wa ila ila kan lati rin nibi, sibẹsibẹ. Ranti pe awọn itọsọna ayelujara ṣe itọsọna iyatọ ti ara ati imọ. A ṣe amọye ọna kan nipasẹ HTML nigbati ara wa ni CSS.
Ti o ba jẹ pe iwe HTML rẹ kún fun awọn eroja ti gbogbo wọn ni awọn orukọ kilasi bi "pupa" tabi "osi", eyi ti o jẹ awọn orukọ ti o ṣalaye bi awọn eroja yẹ ki o wo kuku ju ohun ti wọn jẹ, iwọ n wa larin ila laarin ila ati ara. Mo gbiyanju lati se idinwo awọn orukọ kilasi mi ti kii ṣe iyasọtọ bi o ti ṣee ṣe fun idi yii.
Awọn kilasi pupọ, Semantics, ati JavaScript
Idaniloju miiran si lilo awọn kilasi pupọ ni pe o fun ọ ni ọpọlọpọ awọn iṣeṣe ti o le ṣe awọn ibaraẹnisọrọ.
O le lo awọn kilasi tuntun si awọn eroja to wa tẹlẹ nipa lilo JavaScript laisi yiyọ eyikeyi awọn kilasi akọkọ. O tun le lo awọn kilasi lati ṣokasi awọn semanticics ti ẹya ano . Eyi tumọ si pe o le fi kun lori awọn kilasi afikun lati ṣafihan ohun ti eleyi tumọ si ni titọ. Eyi ni bi Microformats ṣe n ṣiṣẹ.
Awọn alailanfani ti Ọpọlọpọ kilasi
Iyatọ ti o tobi julo lati lo awọn kilasi pupọ lori awọn eroja rẹ jẹ pe o le ṣe wọn ni aiṣedede lati wo ati ṣakoso akoko. O le jẹra lati mọ iru awọn aza ti o ni ipa si ohun kan ati pe awọn iwe afọwọkọ eyikeyi ba n jẹ ọ. Ọpọlọpọ awọn awoṣe ti o wa loni, bi Bootstrap, ṣe lilo awọn eroja ti o lo pẹlu awọn kilasi pupọ. Ti koodu naa le gba jade ati ọwọ lati ṣiṣẹ pẹlu yarayara bi o ko ba ṣọra.
Nigbati o ba lo awọn kilasi pupọ, o tun ṣiṣe awọn ewu ti nini ara fun ẹgbẹ kan ṣe idaamu ara ti miiran paapaa ti o ko ba ni ipinnu fun eyi. Eyi lẹhinna le ṣe ki o nira lati ṣawari idi ti awọn aza rẹ ko ni lo paapaa nigbati o ba han pe wọn yẹ.
O nilo lati ni akiyesi pato, paapaa pẹlu awọn ero ti a lo si nkan kanna!
Nipa lilo ọpa kan bi awọn ọga wẹẹbu irinṣẹ ni Chrome, o le ni irọrun wo bi awọn kilasi rẹ ṣe n ṣe awọn aṣiṣe rẹ ki o si yago fun iṣoro yii ti awọn awọ ati awọn eroja ti o fi ori gbarawọn.
Atilẹkọ article nipasẹ Jennifer Krynin. Ṣatunkọ nipasẹ Jeremy Girard lori 8/7/17