CSS基础：css三大特性（层叠性、优先性、继承性）&css选择器权值

最新推荐文章于 2024-06-14 14:51:07 发布

渣猫略懂

最新推荐文章于 2024-06-14 14:51:07 发布

阅读量78

点赞数

分类专栏：前端基础文章标签： css html html5

本文链接：https://blog.csdn.net/weixin_52854090/article/details/120614476

版权

前端基础专栏收录该内容

30 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			#div1{
				color: #0000FF;
			}
			.class1{
				background-color: #006400;
			}
			#div2{
				color: #006400;
				font-size: 32px;
			}
		</style>
	</head>
	<body>
		<!-- css层叠性：可以同时使用多个选择器，最终样式是由多个样式叠加而来 -->
		<!-- 选择器的优先级特性：默认样式<通用选择器<标签选择器<class选择器<id选择器<行内样式<!important -->
		<!-- 选择器的优先级权值：给选择器添加一个数值（方便记忆，真实不存在），数值大小按照优先级特性排列
		同时使用多个选择器时，将选择器权值相加，值大的优先使用展示
		 -->
		<div id="div1" class="class1">
			123
		</div>
		<!-- css继承性：给父标签设置样式会继承给子标签 -->
		<div id="div2">
			asd123
			<!-- a标签不会继承文字颜色，因为a标签本身的颜色是动态的，需要伪类选择器进行设置 -->
			<a href="">123123</a>
			<!-- h系列标签不要继承字体的大小
			 h1标签的默认字体大小单位是2em,父标签的字体大小是1em,也就是父标签的两倍大
			 -->
			 <!-- 不要把h系列标签放到一个设置字体很大的标签里面或者单独给当前h标签加一个字体大小覆盖系统默认大小 -->
			<h1>asdasd</h1>
		</div>
	</body>
</html>

渣猫略懂

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
CSS基础：css三大特性（层叠性、优先性、继承性）&css选择器权值

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> #div1{ color: #0000FF; } .class1{ background-color: #006400; } #div2{ color: #006400;.
复制链接

扫一扫