CSS中继承的示例分析

小编给大家分享一下CSS中继承的示例分析,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!

创新互联建站始终坚持【策划先行,效果至上】的经营理念,通过多达十年累计超上千家客户的网站建设总结了一套系统有效的全网推广解决方案,现已广泛运用于各行各业的客户,其中包括:生料搅拌车等企业,备受客户赞许。

1、说明解释   -  TOP

这里DIV CSS 继承是指我们设置上级(父级)的CSS样式,上级(父级)及以下的子级(下级)都具有此属性。
一般只有文字文本具有继承特性,如文字大小、文字加粗、文字颜色、字体等。

2、实例:   -  TOP

   CSS 继承特性 - www.创新互联.com  .yangshi{width:400px; color:#F00;} .ziji{ float:left; width:300px;}     我是子级,我上级是yangshi
 
  


说明:我设置上级(父级:yangshi)的文字颜色为红色,而子级(ziji)未设置文字颜色,但是文字具有继承特性,所以子级文字内容依然是红色。

假如设置父级文字样式后,其多个子级中,可能有些子级颜色不想与父级相同,这个时候只需对对应子级设置需要颜色即可。
演示如下:

  1.  

  2.  

  3.  content="text/html; charset=utf-8" /> 

  4. DIV CSS继承特性 - www.创新互联.com 

  5.  

  6. .yangshi{width:400px; color:#F00;} 

  7. .ziji{width:300px;} 

  8. .ziji2{ width:300px; color:#000;} 

  9.  

  10.  

  11.  

  12.  

  13. 我是子级,我上级是yangshi

 

  • 我是子级2,我设置文字颜色为黑色

  •  

  •  

  •  

  •  


  • 说明:yangshi下有ziji与ziji2两个子级,其中ziji继承了父级(上级的红色样式),而ziji2我们需要的是黑色,所以单独对ziji2设置文字为黑色的样式。

    3、继承好处   -  TOP

    可以只设置上级的CSS样式表属性,子级(下级)不用设置,都有此CSS属性,可以减少CSS代码,便于维护。

    4、常见继承CSS属性   -  TOP

    1、字体:font-family
    2、文字大小:css font-size
    3、文本粗细:font-weight
    4、文字颜色:css color
    通常只有文字CSS font具有继承特性,所以大家好好利用与认识。

    以上是“CSS中继承的示例分析”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注创新互联行业资讯频道!


    文章题目:CSS中继承的示例分析
    本文链接:http://pwwzsj.com/article/pgscsd.html

    其他资讯