动态鼠标显示隐藏,display属性——html5教程 前段大G > 首页 > css源码分享 >
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.two {
/* 默认消失 */
display: none;
color: red;
}
.one,
.two {
font-size: 150px;
}
/* 鼠标移动到One元素内，两个元素同时赋予块元素一起显示，One已经是显示状态了，Two由于和One像相绑定所以就实现了显示隐藏 */
.one:hover+.two {
display: block;
}
</style>
</head>
<body>
<div class="one">
请把鼠标移动到我身上
</div>
<div class="two">
可莉登场，降降降降
</div>
</body>
</html>
这篇动态鼠标显示隐藏,display属性——html5教程，文章就结束了，有不懂的地方可以联系站长。希望每个前端人员都有可以找到一个好工作，谢谢观看，祝您生活愉快。
2023-11-21 15:00
文章点击量：
作者：【前端大G】
文章标签：
动态,鼠标,显示,隐藏,display,来,帮忙,见到,
