La propriété de bordure CSS est utilisée pour définir les propriétés de bordure des éléments. C'est un raccourci pour la largeur, le style et la couleur de la bordure. Vous pouvez styliser les bordures de chaque côté et spécifier le rayon de la bordure.
Les contours CSS, en revanche, ne prennent pas de place et, s'ils sont définis, apparaissent autour d'une bordure. Il prend en charge le décalage. De plus, nous ne pouvons pas spécifier si les arêtes individuelles doivent avoir des contours.
Par défaut, les bordures et les contours ne sont pas affichés.
La syntaxe des propriétés de bordure et de contour CSS est la suivante -
Selector {
border: /*value*/
outline: /*value*/
}L'exemple suivant illustre les propriétés de bordure et de contour CSS -
Démo en direct
<!DOCTYPE html>
<html>
<head>
<style>
div {
margin: 15px;
padding: 20px;
width: 35%;
border: thin solid green;
outline-width: 5px;
outline-style: ridge;
outline-color: fuchsia;
border-radius: 50px;
}
</style>
</head>
<body>
<h2>Example</h2>
<div>This is it!</div>
</body>
</html>Cela donne le résultat suivant -
Démonstration en direct
<!DOCTYPE html>
<html>
<head>
<style>
p {
margin: 40px;
padding: 12px;
width: 30%;
border: thick dashed green;
outline: 5px inset;
outline-color: fuchsia;
}
</style>
</head>
<body>
<h2>Demo Heading</h2>
<p>This is demo text surrounded by border and outline.</p>
</body>
</html>Cela donne la sortie suivante-
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!
Résumé des connaissances de base de Java
Solution à l'erreur de socket 10054
Quelle plateforme est Fengxiangjia ?
La différence entre la version familiale Win10 et la version professionnelle
Introduction à l'utilisation de Rowid dans Oracle
Comment utiliser Python pour la boucle
Quel élément est li ?
Comment créer un projet HTML avec vscode
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
