css上下文选择器

来源：动视网责编：小采时间：2020-11-27 18:47:58

css上下文选择器

css上下文选择器:家族: 祖宗,父辈,兄弟同辈关系 1.祖先元素: 包括多级后代的元素; 2.父级元素: 仅包括一级子元素的元素; 3.相邻元素: 拥有同一个父级的元素;1.后代选择器:先找到祖先元素,再选择它下面的所有指定后代元素语法: 祖先与目标之间用空格分开,可以有多级,用多个

推荐度：

点击下载本文 文档为doc格式

导读css上下文选择器:家族: 祖宗,父辈,兄弟同辈关系 1.祖先元素: 包括多级后代的元素; 2.父级元素: 仅包括一级子元素的元素; 3.相邻元素: 拥有同一个父级的元素;1.后代选择器:先找到祖先元素,再选择它下面的所有指定后代元素语法: 祖先与目标之间用空格分开,可以有多级,用多个

家族: 祖宗,父辈,兄弟同辈关系

1.祖先元素: 包括多级后代的元素;

2.父级元素: 仅包括一级子元素的元素;

3.相邻元素: 拥有同一个父级的元素;

1.后代选择器:先找到祖先元素,再选择它下面的所有指定后代元素

语法: 祖先与目标之间用空格分开,可以有多级,用多个空格区隔

格式: 祖先目标 {声明}

2.子选择器:先找到父级元素,再选择他下面所有直接后代元素

语法: 父级 > 目标元素 {样式声明}

3.相邻选择器: 先确定同胞元素的起始点,选择后面的所有的指定元素

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>上下文选择器</title>
<style type="text/css">
.art p {
/*color:red;*/
}
.art > p {
/*color: green;*/
}
.art h1+p {
/*只会将h1后面紧邻的p变色*/
/*color:blue; */
}
.art p+p {
clor: red;
}
</style>
</head>
<body>
<article>
<h1>Gxl网</h1>
<p>永久免费的在线教学网站</p>
<p>将公益进行到底</p>
<p>为了情怀,为了梦想,为了更多像我这样的PHP爱好者</p>
<section>
<h2>如何学习前端</h2>
<p>一定要多动手多写笔记进行总结</p>
</section>
<section>
<h2>原来大家是这样学习的呀~~</h2>
</section>
</article>
<hr>
<ul>
<li>1列表项</li>
<li>2列表项</li>
<li>3列表项</li>
<li>4列表项</li>
<li>5列表项</li>
</ul>
</body>
</html>

css上下文选择器

推荐度：

点击下载本文 文档为doc格式

标签： css 选择器上下文选择器

热门焦点

css上下文选择器

css上下文选择器

css上下文选择器

最新推荐

猜你喜欢

热门推荐