<style type="text/css">
p{color:red;}
.first{color:green;}/*因为权值高显示为绿色*/

span{color:pink;}/*设置为粉色*/
p span{color:purple;}

</style>
</head>
<body>
<h1>勇气</h1>
<p class="first">三年级时,我还是一个<span>胆小如鼠</span>的小女孩,上课从来不敢回答老师提出的问题,生怕回答错了老师会批评我。就一直没有这个勇气来回答老师提出的问题。学校举办的活动我也没勇气参加。</p>

.first{color:green;}的确是权值是大。但<span>在<p>中  span就继承了p的first的权值 在加上后边span自定义的权值 此时的span的权值应该是first的权值加上span自定义的权值 所以span的权值是大于first的权值 当然就应该显示的是粉红色

同理p span{color:purple;}在span{color:purple;}的基础上权值加1.此时p span{color:purple;}权值最大(继承了.first{color:green;})。故 胆小如鼠 最终显示为紫色。

一年多后的补充:

这是我第一遍博客,也是最差的一篇,之所以要留着,为让自己看到自己的成长。

HTML/CSS权值继承的更多相关文章

  1. CSS选择器优先级 CSS权值

    计算指定选择器的优先级:重新认识CSS的权重 标签的权值为 0,0,0,1 类的权值为 0,0,1,0 属性选择的权值为 0,0,1,1  ID的权值为 0,1,0,0 important的权值为最高 ...

  2. css权值问题

    继承是没有权值的,比通配符的的权值0还要低. 选择器是不分上下级的.只管优先级. 第一等:代表内联样式,如: style=””,权值为1000. 第二等:代表ID选择器,如:#content,权值为0 ...

  3. css权值和优先级+命名规范

    选择器权值: 标签选择器:1 类选择器和伪类选择器:10 ID选择器:100 通配符选择器:0 行内样式:1000 !important 在一定条件下,优先级最高 常用的css样式命名 页面结构页头: ...

  4. css权值计算

    外部样式表<内部样式表<内联样式: HTML 标签选择器的权值为 1: Class 类选择器的权值为 10: ID 选择器的权值为 100: 内联样式表的权值最高 1000: !impor ...

  5. CSS权值

    选择器权值 标签选择器:权值为1 类选择器和伪类:权值为10 ID选择器:权值为100 通配符选择器:权值为0 行内样式:权值为1000 !important规则: 可调整样式规则的优先级 添加在样式 ...

  6. CSS权值比较(读书笔记)

    1.继承0.1    标签1    类选择符10    ID选择符100 2.层叠:后面的样式会覆盖前面的样式. 3.内联样式表(标签内部) > 嵌入样式表(当前文件中) > 外部样式(外 ...

  7. css选择器权值

    有的时候我们为同一个元素设置了不同的CSS样式代码,那么元素会启用哪一个CSS样式呢?我们来看一下面的代码: p{color:red;} .first{color:green;} <p clas ...

  8. CSS样式权值

    内联样式表(InLine style)>内部样式表(Internal style sheet)>外部样式表(External style sheet) 例外:但如果外部样式表放在内部样式表 ...

  9. 记录:CSS特殊性——权值规则

    浏览器是根据权值来判断使用哪种css样式的,权值高的就使用哪种css样式. 下面是权值的规则: 标签的权值为1,类选择符的权值为10,ID选择符的权值最高为100.例如下面的代码: p{color:r ...

随机推荐

  1. VS2010 中更改项目名称

    Time.vcxproj修改项目名称,主要是通过以下几个步骤就能完成: 修改解决方案的名称. 修改解决项目名称. 修改项目的程序集名称和默认命名空间 替换整个项目或解决方案中的出现该名称的地方. 修改 ...

  2. RabbitMQ基础篇

    介绍 RabbitMQ 是一个消息中间件:它接收并转发消息.您可以把它想象为一个邮局:当您把需要寄出的邮件投递到邮箱,邮差最终会把邮件送给您的收件人.在这个比喻中,RabbitMQ 就是一个邮箱,也可 ...

  3. 使用object_box遇到的崩溃 java.lang.UnsatisfiedLinkError:

    java.lang.UnsatisfiedLinkError: dalvik.system.PathClassLoader[DexPathList[[zip file "/data/app/ ...

  4. Linux文件系统_每一个的意义

    2017年1月10日, 星期二 Linux文件系统_每一个的意义 rootfs: 根文件系统 FHS:Linux /boot: 系统启动相关的文件,如内核.initrd,以及grub(bootload ...

  5. js检测上传文件大小

    前言: 项目中经常用到需要上传文件.照片等功能,同时需要限制所上传文件的大小.很多插件都会采用后台请求验证,前端Js校验比较少.本篇介绍一个前端JS便捷判断上传文件大小的方法. 代码很简单,关键就是怎 ...

  6. Javascript的V8引擎研究

    1.针对上下文的Snapshot技术 什么是上下文(Contexts)?实际是JS应用程序的运行环境,避免应用程序的修改相互影响,例如一个页面js修改内置对象方法toString,不应该影响到另外页面 ...

  7. Druid.io SQL乱码问题

    1.场景 1.1.依赖版本 avatica-core 1.11.0 druid 0.12.0 1.2.问题重现: 使用Avatica JDBC查询语句:SELECT score FROM studen ...

  8. linux 自定义yum仓库、repo文件 yum命令

    目录 自定义yum仓库:createrepo 自定义repo文件 使用yum命令安装httpd软件包 卸载httpd软件包:yum –y remove 软件名 清除yum缓存:yum clean al ...

  9. laravel 带条件的分页查询

    laravel 带条件的分页查询, 原文:http://blog.csdn.net/u011020900/article/details/52369094 bug:断点查询,点击分页,查询条件消失. ...

  10. centos6.4下配置nginx服务器更改根目录

    安装完nginx服务器后发现nginx的根目录在/usr/share/nginx/html/下,但是对于部署文件来说,在该目录下是不太习惯的,我就尝试着更改nginx访问的根目录 #  vi /etc ...