Rumah >hujung hadapan web >tutorial css >css如何修改html标签的title样式？（代码示例）
css如何修改html标签的title样式？（代码示例）
- 青灯夜游ke hadapan
- 2021-02-19 10:00:157478semak imbas
【推荐教程：CSS视频教程 】
纯CSS实现tooltip，css更改html标签的title样式【笔者有时间会更新一些边界条件。目前的样式在极端情况是有问题的，请不要直接将代码copy到线上环境，这只是笔者写的一个小demo】
html代码：
以下代码直接可用，tootip的样式可以自己调试。
<!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>更多编程相关知识，请访问：编程教学！！
Atas ialah kandungan terperinci css如何修改html标签的title样式？（代码示例）. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Kenyataan：
Artikel ini dikembalikan pada:csdn.net. Jika ada pelanggaran, sila hubungi admin@php.cn Padam
Artikel sebelumnya：css id选择器怎么写Artikel seterusnya：看看CSS中的那些背景图片函数！