<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<style>
*{
list-style: none;
text-decoration: none;
}
#show{
width: 200px;
height: 200px;
background-color: red;
display: none;
}
#show:target{
display: block;
}
</style>
<body>
<!--
锚点:是通过a标签中href中的值找到当前页面中某个元素,
并可以通过味蕾选择器:target让该元素实现【活跃】效果
活跃:某个元素样式发生变化;该元素css增加或减少属性;
或者是已有属性值发生变化
1. 如何使用锚点实现特殊效果
-需要a中href值必须是 #xxx
-需要实现效果的元素id为xxx
-需要通过css伪类 xxx:target对【点击a】时候【xxx样式进行】改变
-->
<button><a href="#show">显示</a></button>
<button><a href="#">隐藏</a></button>
<div id="show"></div>
</body>
</html>
锚点的一些理解
最新推荐文章于 2022-03-12 11:32:59 发布