Тхе ЦСС контура својство је збуњујуће својство. Када први пут сазнате за то, тешко је схватити како се он и издалека разликује од граничног својства. В3Ц то објашњава као следеће разлике:
- Обриси не заузимају простор.
- Обриси могу бити неправокутни.
Обриси не заузимају простор
Ова изјава је сама по себи збуњујућа. Како објект на вашој веб страници не заузима простор на веб страници? Али ако за своју веб страницу мислите да је попут лука, свака ставка на страници може бити наслојена на другу ставку. Својство обрис не заузима простор јер се увек поставља на врх оквира елемента.
Када се контура постави око елемента, то нема никаквог утицаја на то како је тај елемент постављен на страници. То не мења величину или положај елемента. Ако ставите контуру на елемент, заузеће вам исту количину простора као да немате контуру тог елемента. Ово није тачно за а граница. Граница на елементу се додаје спољној ширини и висини елемента. Па ако сте имали слика која је била широка 50 пиксела, са ободом од 2 пиксела, заузимала би 54 пиксела (по 2 пиксела за сваку бочну ивицу). Иста слика са обрисом од 2 пиксела заузимала би само 50 пиксела ширине на вашој страници, обрис би се приказивао преко спољне ивице слике.
Обриси могу бити неправокутни
Пре него што почнете да мислите „кул, сад могу да цртам кругове“, размислите поново. Ова изјава има другачије значење него што мислите. Када ставите обруб на елемент, прегледач га протумачи као да је реч о једном џиновском правоугаоном оквиру. Ако се оквир подели на неколико линија, прегледач само оставља ивице отвореним јер оквир није затворен. Као да прегледач границу види са бескрајно широким екраном - довољно широким да та граница буде један непрекидни правоугаоник.
Насупрот томе, својство обрис узима у обзир ивице. Ако се обрисани елемент протеже на неколико линија, обрис се затвара на крају реда и поново отвара на следећем реду. Ако је могуће, и обрис ће остати у потпуности повезан, стварајући неправокутни облик.
Употребе својства Оутлине
Једна од најбољих употреба својства контура је истицање појмова за претрагу. Многе веб локације то раде у боји позадине, али такође можете да користите својство контура и не бринете о додавању додатних размака на своје странице.
Својство оутлине-цолор прихвата израз „инверт“ (претварач) који боју обриса чини обрнутом од тренутне позадине. Ово вам омогућава да истакнете елементе на динамичким веб страницама без потребе да знате шта користе се боје.
Својство обрис такође можете да користите да бисте уклонили тачкасту линију око активних веза. Овај чланак од ЦСС-трикови показује како уклоните тачкасти обрис.