Hoe maak je schuine randen met borders in CSS

.//. Met CSS is het mogelijk om schuine randen te simuleren. Dit kan via het gebruik van borders. Zie het volgende plaatjes als voorbeeld:

De stappen: .//. De code is als volgt:

  • Ten eerste is een DIV vereist.
  • Ten twee is een CSS style sheet vereist, waarbij twee border een eigen kleur krijgen toebedeeld.
  • Dat is alles! Bij het gebruik van ondergaande code kan het resultaat van het plaatje hierboven worden verwacht!

<div class="box"><h1>Diagonal Lines in CSS</h1></div>
<p><style>
.box {
width:150px;
text-align:right;/*move the text to the right*/
}
</p><p>.box h1 {
border-left:10px solid #fff; /*same as page colour*/
border-bottom:10px solid #000; /*black, bottom, border*/
font-size:18px;
color:#000; /*black text*/}
</style>
</p>

.//.

.//.http://fourshapes.com/articles/2006/07/11/diagonal-lines-in-css/


Reacties (0)

Reageer
Geen resultaten gevonden