Rámečky aneb borders

Občas je potřeba zkrášlit obrázek či jiný objekt rámečkem.
Pár základních tipů pro neIŤáky:

Zaoblený rámeček:

{
border:2px solid #6B238F;
padding:5px 20px;
background:#ffffff;
width:300px;
border-radius:15px;
-moz-border-radius:15px; /* Firefox 3.6 and earlier */
}

Výsledek:

 

 

 

Stínovaný rámeček

{
width:100px;
height:50px;
background-color:purple;
-moz-box-shadow: 15px 15px 5px #888888; /* Firefox 3.6 and earlier */
-webkit-box-shadow: 15px 15px 5px #888888; /* Safari */
box-shadow: 15px 15px 5px #888888;
}
</pre>

Výsledek:

 

 

 

Klasický rámeček

{
border-style:solid;
border-width:5px;
border-color: purple;
}
{
border-style:solid;
border-width:medium;
border-color: purple;
}
{
border-style:solid;
border-width:1px;
border-color: purple;
}

Výsledek:

 

 

 

Tečkovaný a čárkovaný rámeček

{
border-style:dotted;
border-width:5px;
border-color: purple;
padding:5px;
}
{
border-style:dashed;
border-width:medium;
border-color: purple;
padding:5px;
}

Výsledek:

 

 

 

Napsat komentář