网页设计与制作3.0

css高级特性

css复合选择器
1.标签指定式选择器
标签指定式选择器又称交集选择器，有两个选择器构成，其中一个为标记选择器，第二个为class选择器或id选择器，两个选择器之间不能有空格。
p{ color:blue;}
2.后代选择器
后代选择器用来选择元素或元素组的后代，其写法就是把外层标记写在前面，内层标记写在后面，中间用空格分隔。当标记发生嵌套时，内层标记就成为外层标记的后代。
p strong{color:red;}
strong{ color:blue;}
3.并集选择器
并集选择器是各个选择器通过逗号连接而成，任何形式的选择器，都可以作为并集选择器的一部分。如果某些选择器定义的样式完全相同，或部分相同，就可以利用并集选择器为它们定义相同的css样式。
h2,h3,p{ color:red; font-:size:14px}
3.css层叠性和继承性

层叠性：css样式的叠加。

4.继承性：子标记会继承父标记的某些样式。
p,h1,h3,ul,ol,li{color:black;}
可以写成
body{color：black}
并不是所有css属性都可以继承，例如：边框属性，外边距属性，内边距属性，背景属性，定位属性，布局属性，元素宽高属性

5.css优先级

!important > 行内式 > id > class > 标记 > 继承样式

权重相同时，css遵循就近原则

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>新浪</title>
		<style type="text/css">
			.h2{font: 24px 黑体;
			color: #FF0000;
			text-align: left;
			text-decoration: underline;}
			.bule{color: blue;}
			.red{color: #FF0000;}
			.p{font: 14px 楷体;
			color: black;
			text-align: left;}
			.green{color: darkgreen;}
			.black{font: 14px 宋体;
			color: #000000;
			text-decoration: underline;}
		</style>
	</head>
	<body>
		<h2 class="h2">新浪<em class="bule">博客首页——</em>新浪网</h2>
		<p class="p"><em class="red">新浪网</em>博客频道是全中国最主流，最具人气的博客频道。<br>
		拥有最耀眼的娱乐明星博客、最知性的名人博客、最动人的情感博客、最自我的草根博客。</p>
		<p><em class="green">[图片][图片]blog.sina.com.cn/2014-07-07</em><em class="black">-百度快照-评价</em></p>
	</body>
</回头ml

来源：CSDN

作者：王嘉文

链接：https://blog.csdn.net/qq_45684262/article/details/103553735

标签

css选择器

网页设计与制作

css