CSS三大特性

最新推荐文章于 2023-02-13 17:10:46 发布

废柴前端

最新推荐文章于 2023-02-13 17:10:46 发布

阅读量343

点赞数 1

分类专栏： css三大特性 HTML基础文章标签： css html

本文为博主原创文章，未经博主允许不得转载。

本文链接：https://blog.csdn.net/zhuxiandan/article/details/75284613

版权

HTML基础同时被 2 个专栏收录

4 篇文章 0 订阅

订阅专栏

css三大特性

1 篇文章 0 订阅

订阅专栏

CSS三大特性

1.继承性

作用：子元素可以继承父元素的样式

text-，font-，line-这些元素开头的都可以继承，以及color属性

特殊性：

（1）a标签的字体颜色不能继承，必须对a标签自定义字体颜色才能修改

（2）h1~h6标签的字体大小不能继承，必须对标签自身修改字体大小才有效。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
   <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
   <title>继承</title>
   <style>
      .div1{
         color: #ff309e;
      }
   </style>
   <script></script>
</head>
<body>
<div class="div1">
   我是div1中的内容
   <div class="div2">
      我是div2中的内容
   </div>
</div>
</body>
</html>

效果图：

2.层叠性

层叠性是浏览器处理冲突的一个能力，如果一个属性通过两个选择器设置到同一个元素上，那么这个时候一个属性就会将另一个属性层叠掉。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
   <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
   <title>层叠性</title>
   <style>
      .div1 ul li:nth-chirld(1) {
         color: #ff309e;
      }
      .div1 ul .li{
         font-size:0.5cm;
      }
   </style>
   <script></script>
</head>
<body>
<div class="div1">
   <ul>
      <li class="li">我是第一个li</li>
      <li>我是第二个li</li>
      <li>我是第三个li</li>
   </ul>
</div>
</body>
</html>

效果图：