Maison > interface Web > tutoriel CSS > Comment définir le soulignement CSS ? Introduction à la façon de souligner le texte en CSS

Comment définir le soulignement CSS ? Introduction à la façon de souligner le texte en CSS

不言
Libérer: 2018-10-27 11:16:58
original
9996 Les gens l'ont consulté

Par défaut, les polices de texte sur les pages Web n'ont pas de style de soulignement, mais parfois nous verrons un soulignement sous le texte qui n'est pas un lien sur une page Web. Alors, comment ce style de soulignement est-il implémenté ? Cet article vous expliquera comment définir le soulignement du texte en CSS. Examinons ensuite le contenu spécifique.

Il existe un attribut text-decoration en CSS. Cet attribut est utilisé pour implémenter le soulignement du texte. Le code pour implémenter le soulignement du texte est également très simple.

Le code de l'attribut text-decoration. implémenter le soulignement du texte est le suivant :

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style type="text/css">
        div{
            text-decoration: underline;
        }
    </style>
</head>
<body>
<div>php中文网文字加下划线</div>
</body>
</html>
Copier après la connexion

L'effet de la définition du soulignement du texte en CSS est le suivant :

Comment définir le soulignement CSS ? Introduction à la façon de souligner le texte en CSS

La méthode ci-dessus n'est-elle pas très simple ? Il vous suffit de donner un style au texte pour en ajouter un. En fait, il existe une autre façon de souligner le texte en CSS, qui consiste à utiliser l'attribut border du CSS. Examinons de plus près le fonctionnement de l'attribut border en CSS. CSS peut souligner le texte.

L'attribut border peut être utilisé pour obtenir un effet de soulignement de texte via la bordure inférieure inférieure. Examinons de plus près le code pour obtenir un soulignement de texte

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style type="text/css">
        span{
            border-bottom: 1px solid pink;
        }
        
    </style>
</head>
<body>
<span>中文网文字下划线</span>
</body>
</html>
Copier après la connexion

L'effet de soulignement de texte. est la suivante :

Comment définir le soulignement CSS ? Introduction à la façon de souligner le texte en CSS

Si vous souhaitez modifier le soulignement du texte en ligne pointillée, remplacez simplement le solide dans le code ci-dessus en pointillés ou en pointillés.

Enfin, pourquoi span est utilisé à la place de div dans le code ci-dessus, c'est parce que la balise div occupe une ligne, et la balise span occupe autant d'espace que le contenu est large, donc c'est relativement simple à utiliser la balise span.

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:
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