Ang mga laraw sa CSS labaw pa kay sa utlanan lamang
Ang CSS outline property usa ka makalibog nga kabtangan. Sa diha nga ikaw una nga nakakat-on bahin niini, lisud ang pagsabut kung giunsa kini lahi gikan sa utlanan sa utlanan. Gipatin-aw kini sa W3C nga adunay mga mosunod nga kalainan:
- Ang mga balangkas wala'y luna.
- Ang laraw mahimo nga dili rectangular.
Ang mga balangkas dili moapil sa lugar
Kini nga pamahayag, sa sulod ug sa kaugalingon niini makalibog. Sa unsa nga paagi nga ang usa ka butang sa imong Web page dili mogamit sa luna diha sa Web page? Apan kon ikaw naghunahuna sa imong Web page nga sama sa usa ka sibuyas, ang matag butang sa panid mahimo nga laylayan ibabaw sa laing butang. Ang outline nga propyedad wala magkuha sa luna tungod kay kini kanunay gibutang sa ibabaw sa kahon sa elemento.
Sa diha nga ang usa ka outline nga gibutang sa palibot sa usa ka elemento, kini walay bisan unsa nga epekto sa kon unsa nga elemento nga gibutang sa pahina. Kini wala mag-usab sa gidak-on o posisyon sa elemento. Kon imong gibutang ang usa ka outline sa usa ka elemento, kini magkuha sa sama nga gidaghanon sa luna ingon nga wala ka adunay outline sa maong elemento. Kini dili tinuod sa utlanan. Ang usa ka utlanan sa usa ka elemento gidugang ngadto sa gilapdon sa gawas ug gitas-on sa elemento. Busa kung adunay usa ka imahen nga 50 ka pixel ang gilapdon, nga adunay 2-pixel nga utlanan, kini moabut sa 54 ka pixel (2 pixel alang sa matag kilid nga utlanan). Ang sama nga hulagway nga adunay 2-pixel nga balangkas moabut lamang sa 50 ka pixel nga lapad sa imong panid, ang outline magpakita sa gawas nga ngilit sa hulagway.
Ang Mga Sulud Nga Mahimong Dili-Rectangular
Sa dili pa ikaw magsugod sa paghunahuna nga "cool, karon ako makakuha og mga sirkulo!" Hunahunaa pag-usab. Kini nga pahayag adunay laing kahulugan kay sa imong gihunahuna. Kon magbutang ka og utlanan sa usa ka elemento, ang browser naghubad sa elemento ingon nga kini usa ka higanteng rectangular box. Kon ang kahon mabahin sa daghang mga linya, ang browser mobiya sa mga sulud nga bukas tungod kay ang kahon wala masirado. Kini ingon nga ang browser nga nagtan-aw sa utlanan sa usa ka walay katapusan nga lapad nga screen - igo nga gilapdon alang kana nga utlanan nga usa ka padayon nga rectangle.
Sa kasukwahi, ang outline nga kabtangan nagkinahanglan og konsiderasyon. Kung ang gilatid nga elemento adunay daghang mga linya, ang outline magsirado sa katapusan sa linya ug moabli pag-usab sa sunod nga linya. Kung mahimo, ang outline magpabilin nga bug-os nga konektado usab, nga maghimo sa usa ka dili-rectangular nga porma.
Paggamit sa Outline Property
Usa sa pinakamaayo nga paggamit sa outline property mao ang pag-highlight sa mga termino sa pagpangita. Daghang mga site ang naghimo niini nga may kolor sa background, apan mahimo usab nimo gamiton ang outline property ug dili mabalaka mahitungod sa pagdugang sa bisan unsa nga dugang nga spacing sa imong mga panid.
Ang propiedad nga kolor-kolor nga modawat sa termino nga "balit-ad" nga naghimo sa outline nga kolor sa pagsukip sa kasamtangan nga kasinatian. Kini nagtugot kanimo sa pag-highlight sa mga elemento sa dinamikong mga panid sa Web nga dili kinahanglan nga masayud kung unsang mga kolor ang gigamit .
Mahimo usab nimo gamiton ang outline property aron kuhaon ang gibug-aton nga linya sa mga aktibong link. Kini nga artikulo gikan sa CSS-Tricks nagpakita kon unsaon pagtangtang sa gisulud nga outline.