Maison  >  Article  >  interface Web  >  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

不言
不言original
2018-10-27 11:16:589921parcourir

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>

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>

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!

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