Maison > interface Web > tutoriel CSS > qu'est-ce que le CSS après

qu'est-ce que le CSS après

藏色散人
Libérer: 2023-01-04 09:36:29
original
10209 Les gens l'ont consulté

css after est un sélecteur en CSS. Ce sélecteur peut être utilisé pour insérer du contenu après le contenu de l'élément sélectionné. Sa syntaxe est telle que "p:after{ content:"";background-color:white. ;couleur:rouge;}".

qu'est-ce que le CSS après

L'environnement d'exploitation de cet article : système Windows 7, ordinateur Dell G3, version css3.

Recommandation : "tutoriel vidéo CSS"

En CSS, la fonction de la pseudo-classe :after est d'ajouter du contenu à l'élément spécifié (plutôt que l'élément lui-même) Insérez ensuite un élément en ligne contenant le contenu spécifié par l'attribut content.

L'utilisation la plus basique est la suivante :

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<style>
p:after {
content: "- 台词";
}
</style>
</head>
<body>
<p>我是唐老鸭。</p>
<p>我住在 Duckburg。</p>
</body>
</html>
Copier après la connexion

Rendu :

quest-ce que le CSS après

Quelques applications de la pseudo-classe after

 : afterClear floats

Lorsque la disposition flottante provoque un effondrement de la hauteur et affecte la disposition globale, les éléments doivent être débarrassés des flotteurs en utilisant : after est l'une des méthodes :

.row:after {
width:0;
height:0;
content:&#39;&#39;;
display: block;
clear: both;
}
Copier après la connexion

Pseudo. classes et pseudo-éléments

L'élément de sélection de pseudo-classe est basé sur l'état actuel de l'élément, ou sur les caractéristiques actuelles de l'élément, plutôt que sur des signes statiques tels que l'identifiant, la classe et l'élément de l'élément. attributs. Puisque l'état change dynamiquement, lorsqu'un élément atteint un état spécifique, il peut acquérir un style de pseudo-classe ; lorsque l'état change, il perdra ce style ; On peut voir que sa fonction est quelque peu similaire à celle d'une classe, mais elle est basée sur une abstraction en dehors du document, c'est pourquoi on l'appelle une pseudo-classe.

Différent des pseudo-classes qui ciblent des éléments dans des états spéciaux, les pseudo-éléments opèrent sur un contenu spécifique dans les éléments. Le niveau qu'ils opèrent est plus profond que celui des pseudo-classes, leur dynamique est donc la même. beaucoup plus faible. En fait, le but de la conception de pseudo-éléments est de sélectionner la première lettre (lettre) et la première ligne du contenu de l'élément, ainsi que de sélectionner le recto ou le verso de certains contenus, ce que les sélecteurs ordinaires ne peuvent pas faire. Le contenu qu'il contrôle est en fait le même que l'élément, mais il ne s'agit que d'une abstraction basée sur l'élément et n'existe pas dans le document, c'est pourquoi on l'appelle un pseudo-élément.

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!

Étiquettes associées:
css
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal