HTML/CSS权值继承
<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权值继承的更多相关文章
- CSS选择器优先级 CSS权值
计算指定选择器的优先级:重新认识CSS的权重 标签的权值为 0,0,0,1 类的权值为 0,0,1,0 属性选择的权值为 0,0,1,1 ID的权值为 0,1,0,0 important的权值为最高 ...
- css权值问题
继承是没有权值的,比通配符的的权值0还要低. 选择器是不分上下级的.只管优先级. 第一等:代表内联样式,如: style=””,权值为1000. 第二等:代表ID选择器,如:#content,权值为0 ...
- css权值和优先级+命名规范
选择器权值: 标签选择器:1 类选择器和伪类选择器:10 ID选择器:100 通配符选择器:0 行内样式:1000 !important 在一定条件下,优先级最高 常用的css样式命名 页面结构页头: ...
- css权值计算
外部样式表<内部样式表<内联样式: HTML 标签选择器的权值为 1: Class 类选择器的权值为 10: ID 选择器的权值为 100: 内联样式表的权值最高 1000: !impor ...
- CSS权值
选择器权值 标签选择器:权值为1 类选择器和伪类:权值为10 ID选择器:权值为100 通配符选择器:权值为0 行内样式:权值为1000 !important规则: 可调整样式规则的优先级 添加在样式 ...
- CSS权值比较(读书笔记)
1.继承0.1 标签1 类选择符10 ID选择符100 2.层叠:后面的样式会覆盖前面的样式. 3.内联样式表(标签内部) > 嵌入样式表(当前文件中) > 外部样式(外 ...
- css选择器权值
有的时候我们为同一个元素设置了不同的CSS样式代码,那么元素会启用哪一个CSS样式呢?我们来看一下面的代码: p{color:red;} .first{color:green;} <p clas ...
- CSS样式权值
内联样式表(InLine style)>内部样式表(Internal style sheet)>外部样式表(External style sheet) 例外:但如果外部样式表放在内部样式表 ...
- 记录:CSS特殊性——权值规则
浏览器是根据权值来判断使用哪种css样式的,权值高的就使用哪种css样式. 下面是权值的规则: 标签的权值为1,类选择符的权值为10,ID选择符的权值最高为100.例如下面的代码: p{color:r ...
随机推荐
- Ansible11:变量详解
目录 简单说明 一.在Inventory中定义变量 二.在Playbook中定义变量 1.通过vars关键字定义 2.通过vars_files关键字引入变量文件 3.通过vars_prompt来实现人 ...
- U40620 还没想好名字的题
U40620 niiickの还没想好名字的题 给定一个长度为\(n\)的序列\(a_1,a_2...,a_n\) 要求将这\(n\)个数分为\(m\)组,每组可以有任意多个数,但同一组中的数必须是原序 ...
- python---重点(设计模式)
前戏:设计模式简介 设计模式是面向对象设计的解决方案,是复用性程序设计的经验总结.(与语言无关,任何语言都可以实现设计模式) 设计模式根据使用目的的不同而分为创建型模式(Creational Patt ...
- android安全技术技能清单
大部分android apk都是在裸奔.大部分android程序员,有一些懂得代码混淆,然而,这东西也不靠谱.除去第三方提供的服务的服务的话,大部分android apk就是在裸奔.不过,使用第三方的 ...
- Nginx服务优化详解
Nginx服务优化详解 1.隐藏Nginx版本信息 编辑主配置文件nginx.conf,在http标签中添加代码 server_tokens off;来隐藏软件版本号. 2.更改Nginx服务启动的默 ...
- Python练习-跨目录调用模块
层级结构: dir1 ---hello.py dir2 ---main.py 其中,hello.py: def add(x,y): return x+y main.py如何能调用到hello.py中的 ...
- linux学习记录.3.virtualbox 共享文件夹
需要先安装增强功能. 设置目录后, mkdir /mnt/WinDownload //建立映射目录 sudo mount -t vboxsf Download /mnt/Windwnload ...
- 20155303 《Java程序设计》实验一(Java开发环境的熟悉)实验报告
20155303 <Java程序设计>实验一(Java开发环境的熟悉)实验报告 一.实验内容及步骤 (一)使用JDK编译.运行简单的java程序 命令行下的程序开发 步骤一(新建文件夹): ...
- 使用python开发一个能够计算带括号的复杂表达式的计算器(只支持加减乘除)
使用到了模块re,正则,字典等 # 实现简单的加减乘除括号等运算 # Calculator def calculator(expression): print(expression) import r ...
- input 标签禁止输入
1.鼠标可以点击输入框,但是不能输入 readonly 例如: <input class="layui-input" readonly > 2.鼠标点击输入框出现禁用图 ...