Une brève analyse des propriétés de bordure CSS : largeur, style et bordure, etc.

Cet article vous présente une brève analyse des propriétés de bordure CSS : largeur, style et bordure, etc. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il vous sera utile.

Définition et utilisation

Une ou plusieurs lignes entourant le contenu et le remplissage d'un élément.

Attributs de base : largeur, style, couleur

largeur bordure-largeur

• bordure- La propriété raccourcie width définit la largeur de toutes les bordures de l'élément, ou de chaque bordure individuellement. La valeur

• peut être une longueur spécifiée, telle que 1px, ou l'un des trois mots-clés : thin, medium, thick, qui sont respectivement fins et moyens ( Par défaut) et gras.

• Ne fonctionne que si le style de bordure n'est pas nul. Si le style de bordure n'est aucun, la largeur de la bordure est en fait réinitialisée à 0. Les valeurs de longueur négatives ne sont pas autorisées.

• L'ordre de réglage des bordures est haut-droite-bas-gauche. Vous pouvez l'abréger si vous connaissez l'ordre.

Style La propriété border-style

border-style est utilisée pour définir le style de la bordure de l'élément.

值	描述
none	定义无边框。
hidden	与 "none" 相同。不过应用于表时除外，对于表，hidden 用于解决边框冲突。
dotted	定义点状边框。在大多数浏览器中呈现为实线。
dashed	定义虚线。在大多数浏览器中呈现为实线。
solid	定义实线。
double	定义双线。双线的宽度等于 border-width 的值。
groove	定义 3D 凹槽边框。其效果取决于 border-color 的值。
ridge	定义 3D 垄状边框。其效果取决于 border-color 的值。
inset	定义 3D inset 边框。其效果取决于 border-color 的值。
outset	定义 3D outset 边框。其效果取决于 border-color 的值。

• La valeur par défaut est none, donc si vous souhaitez que la bordure apparaisse, vous devez déclarer un style.

• Vous pouvez définir plusieurs styles pour une bordure.

• La bordure peut apparaître uniquement si cette valeur n'est pas nulle.

Color La propriété border-color

border-color est utilisée pour définir la couleur de la bordure de l'élément.

• La couleur de bordure par défaut est la couleur de premier plan de l'élément lui-même. Si aucune couleur n'est déclarée pour la bordure, elle sera la même que la couleur du texte de l'élément. En revanche, si l'élément n'a pas de texte, disons qu'il s'agit d'un tableau contenant uniquement des images, alors la couleur de la bordure du tableau sera la couleur du texte de son élément parent (puisque la couleur est héritée). Cet élément parent est très probablement body, p ou une autre table.

• La bordure peut être définie comme transparente avec la valeur transparent. Cette valeur est utilisée pour créer une bordure invisible avec une largeur.

Bordure et arrière-plan

La bordure est placée au-dessus de l'arrière-plan de l'élément.

Bordure des coins arrondis

L'effet de coin arrondi autour de l'élément est une fonction fréquemment nécessaire, et l'attribut border-radius peut définir les coins arrondis.

• Les versions antérieures à ie9 ne sont pas compatibles avec l'attribut coin arrondi.

• La valeur est la longueur spécifiée, par exemple 4px.

Attributs étendus

border-image border-image

Articles connexes recommandés :

Quels sont les types de contexte de formatage (FC) dans la mise en page CSS ? Introduction aux types de contexte de formatage (FC)

Deux façons d'introduire la disposition en grille CSS (Grid) (avec code)

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!