A szegélystílusok - WEBFEJLESZTÉS, WEBÁRUHÁZ KÉSZÍTÉS

A szegélystílusok

A szegély stílusa a border-style tulajdonság segítségével állítható be.

A szegély stílusának megadása:

kijelölő

{

border-style

kulcsszó;

}

Példa:

Forráskód


<style>
    div  {border-width:3px;margin: 2px;float: left;
            width: 100px; height: 50px; }  
    #id_0 {border-style:none;}   
    #id_1 {border-style:solid;} 
    #id_2 {border-style:dotted;}  
    #id_3 {border-style:dashed;} 
    #id_4 {border-style:double;} 
    #id_5 {border-style:groove;}
    #id_6 {border-style:ridge;} 
    #id_7 {border-style:inset;} 
    #id_8 {border-style:outset;}  
    #id_9 {border-style:inherit;} 
    #id_10 {border-style:hidden;}  
</style>     
...
<body>    
     <div id="id_0">none</div>           
     <div id="id_1">solid</div>
     <div id="id_2">dotted</div>  
     <div id="id_3">dashed</div>
     <div id="id_4">double</div>  
     <div id="id_5">groove</div>
     <div id="id_6">ridge</div>  
     <div id="id_7">inset</div>
     <div id="id_8">outset</div>          
     <div id="id_9">inherit</div>
     <div id="id_10">hidden</div>    
</body>

Eredmény*

* Az eredmény megjelenítése az Ön által használt böngészőtől függ.
A példakód külön ablakban is megtekinthető: css_szegely_stilus.html