Faire son site 11 : Référence CSS - border

border

La propriété border est une propriété raccourcie qui permet de définir les propriétés liées à la bordure. border peut être utilisée pour définir les valeurs de border-width, border-style, border-color.

Comme pour toutes les propriétés raccourcie, si une valeur est absente pour la propriété détaillée correspondante, cette dernière sera réinitialisée avec sa valeur initiale.
La propriété border affecte les quatre côtés de l'élément auquel elle se rapporte.


<style>
.ex {
  width: 200px;
  height: 200px;
  background-color: greenyellow;
}
#ex01 {
margin-left: 10px;
}
#exbr {
  border: 10px dotted red;
}
</style>

<div class="ex" id="ex01"></div>
<div class="ex" id="exbr"></div>



On peut voir sur l'exemple ci-dessus que, par défaut, la bordure se place à l'extérieur du bloc associé. Il faut en tenir compte lorsque l'on accole différents éléments.