css复合选择器小案例

最新推荐文章于 2024-06-19 15:19:49 发布

异想实验室

最新推荐文章于 2024-06-19 15:19:49 发布

阅读量208

点赞数

分类专栏： HTML

异想实验室

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

版权

css css3 前端

HTML 专栏收录该内容

11 篇文章 2 订阅

订阅专栏

使用样式将，nva类下方的 ul li a 标签链接,文字颜色更改为红色；

使用样式将，hot类下的文字电脑文字样式更为为红色，其他的文字颜色保持默认；

html+css代码：

<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title>css复合选择器-作业</title>
		<link rel="shortcut icon" href="https://static.runoob.com/images/favicon.ico">

		<style>
			.nva ul li a {
				color: red;
			}

			.hot>a {

				color: red;
			}
		</style>



	</head>

	<body>

		使用样式将，nva类下方的 ul li a 标签链接,文字颜色更改为红色；
		<div class="nva">
			<ul>
				<li><a href="http://www.baidu.com" target="_blank">百度</a></li>
				<li><a href="http://www.qq.com" target="_blank">腾讯</a></li>
			</ul>
		</div>

		使用样式将，hot类下的 文字 电脑 文字样式更为为红色，其他的文字颜色保持默认；

		<div class="hot">

			<a href="#">电脑</a>
			<ul>
				<li><a href="/">显示器</a></li>

				<li><a href="/">键盘</a></li>
			</ul>

		</div>

	</body>

</html>

实现效果：