Maison >interface Web >tutoriel CSS >Comment modifier le style du titre de la balise html avec CSS ? (exemple de code)

Comment modifier le style du titre de la balise html avec CSS ? (exemple de code)

青灯夜游
青灯夜游avant
2021-02-19 10:00:157477parcourir

Comment modifier le style du titre de la balise html avec CSS ? (exemple de code)

[Tutoriel recommandé : Tutoriel vidéo CSS]

CSS pur pour implémenter une info-bulle, CSS pour changer le style de titre de la balise html [Le l'auteur mettra à jour quand il aura le temps Certaines conditions aux limites. Le style actuel est problématique dans les cas extrêmes. Veuillez ne pas copier le code directement dans l'environnement en ligne. Ceci est juste une petite démo écrite par l'auteur]

code html :

.

Le code suivant est disponible directement et le style de Tootip peut être débogué par vous-même.

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        .box {
            display: flex;
            justify-content: center;
            align-items: center;
        }
        span {
            position: relative;
            margin: 50px auto;
            border: 1px solid;
        }
        span[aria-label]:hover:after {
            content: attr(aria-label);
            position: absolute;
            bottom: -30px;
            left: 0;
            border: 1px solid;
            width: 100%;
        }
    </style>
</head>
<body>
    <div class="box">
        <span aria-label="我是tooltip">我是主体内容啊</span>
    </div>
</body>
</html>

Pour plus de connaissances liées à la programmation, veuillez visiter : Enseignement de la programmation ! !

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:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer