css之子选择器

最新推荐文章于 2024-04-26 22:14:41 发布

异想实验室

最新推荐文章于 2024-04-26 22:14:41 发布

阅读量867

点赞数

分类专栏： HTML 文章标签： css html 前端

异想实验室

本文链接：https://blog.csdn.net/weixin_43775400/article/details/123187840

版权

HTML 专栏收录该内容

11 篇文章 2 订阅

订阅专栏

子选择器，格式父标签 > 子标签关系符为大于号；
并不会让孙标签更改样式 */

html+css代码：

<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title>子选择器</title>
		<meta name="viewport"
			content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

	</head>


	<style>
	/* 
	子选择器，格式 父标签 > 子标签  关系符为大于号；
	并不会让孙标签更改样式 */

		.nva > a {
			color: red;
			font-weight: bold;
		}
	</style>

	<body>

		<div class="nva">
			<a href="/">这个是儿子</a>
			<p><a href="/">这个是孙子</a></p>
			</div>


	</body>

</html>

实现效果：