Maison > Article > interface Web > Puis-je contrôler l’affichage des lignes pointillées en CSS ?

Puis-je contrôler l’affichage des lignes pointillées en CSS ?

青灯夜游original: 2022-09-14 14:16:292269parcourir

Vous pouvez contrôler l'affichage des lignes pointillées en CSS. En CSS, vous pouvez utiliser l'attribut border-style pour définir le style de bordure en pointillés. Il vous suffit d'ajouter le style "border-style:dashed;" à l'élément ; bordure de l'élément. Lorsque la valeur est "en pointillés", vous pouvez définir le style de bordure en pointillé.

L'environnement d'exploitation de ce tutoriel : système Windows7, version CSS3&&HTML5, ordinateur Dell G3.

Vous pouvez contrôler l'affichage des lignes pointillées en CSS, utilisez simplement l'attribut border-style.

L'attribut border-style est utilisé pour définir le style de la bordure de l'élément. Lorsque la valeur est "en pointillés", le style de bordure en pointillés peut être défini.

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<style type="text/css">
			p.dashed {
				border-style: dashed
			}
			
			p.solid {
				border-style: solid
			}
		</style>
	</head>

	<body>

		<p class="dashed">这是虚线边框样式！</p>

		<p class="solid">这是实线边框样式！</p>

	</body>

</html>

Puis-je contrôler l’affichage des lignes pointillées en CSS ?

La valeur à laquelle l'attribut border-style peut être défini

valeur	description
none	ne définit aucune bordure.
caché	est identique à "aucun". Sauf lorsqu'il est appliqué aux tables, pour lesquelles Hidden est utilisé pour résoudre les conflits de bordure.
pointillé	Définissez des bordures en pointillés. S'affiche sous la forme d'une ligne continue dans la plupart des navigateurs.
dashed	définit la ligne pointillée. S'affiche sous la forme d'une ligne continue dans la plupart des navigateurs.
solid	définit une ligne solide.
double	définit des lignes doubles. La largeur de la double ligne est égale à la valeur de border-width.
groove	Définissez la bordure de rainure 3D. L'effet dépend de la valeur de border-color.
ridge	Définissez la bordure de crête 3D. L'effet dépend de la valeur de border-color.
inset	Définissez une bordure incrustée 3D. L'effet dépend de la valeur de border-color.
début	Définissez la bordure de départ 3D. L'effet dépend de la valeur de border-color.
inherit	spécifie que le style de bordure doit être hérité de l'élément parent.

Explication : L'attribut

border-style est un attribut raccourci qui peut définir le style des quatre bordures d'un élément. Si vous souhaitez définir le style d'une bordure séparément, vous pouvez implémenter :

.
attribut border-top-style : style de bordure supérieure
attribut border-bottom-style : style de bordure inférieure
attribut border-left-style : style de bordure gauche
attribut border-right-style : style de bordure droite

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<style type="text/css">
			p.dashed {
				border-top-style: dashed;
				border-bottom-style: dashed
			}
			
			p.solid {
				border-left-style: solid;
				border-right-style: solid;
			}
		</style>
	</head>

	<body>

		<p class="dashed">这是虚线边框样式！</p>

		<p class="solid">这是实线边框样式！</p>

	</body>

</html>

Puis-je contrôler l’affichage des lignes pointillées en CSS ?

(Partage de vidéos d'apprentissage : front-end web)

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!

html5 css css3 double 继承 border

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Que signifie le code CSS barré ?Article suivant：Que signifie le code CSS barré ?

Articles Liés

Voir plus