html优先级和层叠性

最新推荐文章于 2024-07-22 20:28:40 发布

Begin to change

最新推荐文章于 2024-07-22 20:28:40 发布

阅读量2.1k

点赞数

分类专栏：网页设计

本文链接：https://blog.csdn.net/qq_41404557/article/details/83933336

版权

网页设计专栏收录该内容

13 篇文章 9 订阅

订阅专栏

所谓层叠性是指多种CSS样式的叠加。例如，使用内嵌式CSS样式表定义<p>标记字号大小为12像素，链入式定义<p>标记颜色为红色，那么段落文本将显示为12像素红色，即这两种样式产生了叠加。

本案例通过给同一个元素设置不同的颜色值来演示CSS层叠性的效果。

分别给同一标记设置两种不同的颜色，第一种使用标记选择器设为蓝色，第二种使用类选择器设为红色。
通过输出的文本颜色，来演示CSS的层叠性和优先级的效果。

 1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
 2"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 3<html xmlns="http://www.w3.org/1999/xhtml">
 4<head>
 5<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 6<title>CSS层叠性</title>
 7<style type="text/css">
 8div{color:#00F;}
 9.red{color:red;}
 10</style>
 11</head>
 12<body>
 13<div class="red">CSS层叠性演示，猜猜我是什么颜色？</div>
 14</body>
 15</html>