目标伪类选择器 :target

最新推荐文章于 2023-03-28 20:18:47 发布

clqxmt

最新推荐文章于 2023-03-28 20:18:47 发布

阅读量570

点赞数 1

分类专栏： CSS 文章标签：目标伪类选择器 :target

本文链接：https://blog.csdn.net/weixin_43755513/article/details/98080463

版权

CSS 专栏收录该内容

68 篇文章 0 订阅

订阅专栏

目标伪类选择器 :target

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			*{margin:0; padding:0;}
			div{background:#f00; height:100px; margin-bottom:50px;}
			:target{background:#ff0;}
			:target h1{color:#00f;}
		</style>
	</head>
	<body>
		<a href="#top1">top1</a>
		<a href="#top2">top2</a>
		<a href="#top3">top3</a>
		<a href="#top4">top4</a>
		<div id="top1">div1
		 <h1>h1</h1>
		</div>
		<div id="top2">div2
		<h1>h1</h1>
		</div>
		<div id="top3">div3
		<h1>h1</h1>
		</div>
		<div id="top4">div4
		<h1>h1</h1>
		</div>
	</body>
</html>

在这里插入图片描述