En CSS, vous pouvez utiliser l'attribut border-width pour définir la largeur de la bordure. Le format de syntaxe est "border-width:keyword | value with length unit;" où le mot-clé peut être fin ( fine) bordure), moyenne (bordure moyenne), épaisse (bordure épaisse).
L'environnement d'exploitation de ce tutoriel : système Windows 7, version CSS3&&HTML5, ordinateur Dell G3.
css définit la largeur de la bordure
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
p.one
{
border-style:solid;
border-width:5px;
}
p.two
{
border-style:solid;
border-width:medium;
}
p.three
{
border-style:solid;
border-width:thick;
}
</style>
</head>
<body>
<p class="one">一些文本。</p>
<p class="two">一些文本。</p>
<p class="three">一些文本。</p>
</body>
</html>Rendu :
Instructions :
L'attribut "border-width" ne fonctionnera pas s'il est utilisé seul. Vous devez d'abord utiliser l'attribut "border-style" pour définir la bordure.
Propriété CSS border-width
La propriété border-width définit la largeur des quatre bordures d'un élément.
Valeur de l'attribut :
| 值 | 描述 |
|---|---|
| thin | 定义细的边框。 |
| medium | 默认。定义中等的边框。 |
| thick | 定义粗的边框。 |
| length | 允许您自定义边框的宽度。 |
L'attribut border-width peut avoir une à quatre valeurs.
Exemple :
border-width:thin medium thick 10px;
La bordure supérieure est une bordure fine
La bordure droite est une bordure moyenne
La bordure inférieure est une bordure épaisse
La bordure gauche est une bordure de 10 px de large
border-width:thin medium thick;
Bordure supérieure C'est une bordure fine
Les bordures droite et gauche sont des bordures moyennes
La bordure inférieure est une bordure épaisse
border-width:thin medium;
Les bordures supérieure et inférieure sont des bordures fines
Les bordures droite et gauche sont des bordures moyennes
border-width:thin;
Les 4 bordures sont de fines bordures
(Partage vidéo d'apprentissage : tutoriel vidéo CSS)
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!
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
