CSS样式的特点与优先选择权
CSS样式的特点:(子元素会继承父元素的某些样式,子元素有自己的样式就用自己的样式,没有的就用父元素的)
1.继承:
网页中子元素,将继承父元素的样式(比如要控制p标签中的文字大小,可以直接给body标记添加样式)
2.层叠:
网页中子元素定义了与父元素相同的样式,则子元素的样式将覆盖父元素的样式
后面的样式会覆盖前面的样式
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml">
3 <head>
4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5 <title>CSS样式的特点</title>
6 <style type="text/css">
7 body{
8 font-size:24px;
9 color:#F00;}
10 p{color:#F0F;}
11 /*下面的样式会覆盖上面的样式*/
12 p{color:#0F0;}
13 </style>
14 </head>
15 <body>
16 <p>0.5秒三分绝杀!波特兰上演波什时刻 第N次拯救热火</p>
17 <h1>玩命暴扣扳平+助攻绝杀三分 热火太幸运有这颗队魂</h1>
18 <p>热火今夜还一功臣必须赞 11分不多但却分分是金!</p>
19 <p>詹波为小弟恶犯叫屈 当事人他都起飞了!肯定假摔</p>
20 <p>斯帅称客战开拓者奥登不打 波什:他很快就可复出</p>
21 </body>
22 </html>
CSS样式优先选择权:当样式有冲突时,以哪个为准
内联式-----内嵌式-----链接式----导入式
就近原则
作用范围越小优先权越高
离要修饰的目标越近的样式优先权越高
选择符优先权:
行内----id----class----标签选择符(可以采用!important语法来提升优先权(IE6不支持))
CSS样式的特点与优先选择权的更多相关文章
- css样式的优先顺序
一.css样式的权重:!important(1000+) > 内联样式( 1000 ) > ID选择器(100 ) > 类选择器(10) > 标签选择器( 1 ) > ...
- CSS选择器的权重与优先规则?
我们做项目的时候,经常遇到样式层叠问题,被其他的样式覆盖,或者写的权重不高没效果,对权重没有具体的分析,做了一个总结. css继承是从一个元素向其后代元素传递属性值所采用的机制.确定应当向一个元素应用 ...
- CSS样式之优先级
说到到css的样式优先级,今天偶再来回顾下,从css的样式优先级可分为两个部分: 1.从CSS代码放置的位置看权重优先级: 内联样式 > 内部嵌入样式 >外联样式 2.从样式选择器 ...
- CSS特异性(CSS Specificity)的细节之CSS样式权重的计算与理解(CSS样式覆盖规则)
本篇讲解CSS特异性(CSS Specificity)的细节,也就是CSS样式选择器的权重计算 通过计算选择器的权重(weight)最终决定哪个选择器将获得优先权去覆盖其他选择器的样式设定,即“优先原 ...
- [HTML/HTML5]2 CSS样式表设置
2.1 在HTML文件中设置样式表 当前HTML"规则"指出:HTML仅用于标识页面的内容,应该使用样式表来定义内容的呈现样式.这不仅使Web页面对于所有用户(无论采用什么浏览器 ...
- CSS样式表继承详解
最近在恶补css样式表的基础知识.上次研究了css样式表之冲突问题详解 .这次是对 css 继承 特性的学习. 什么是css 继承?要想了解css样式表的继承,我们先从文档树(HTML DOM)开始. ...
- CSS样式选择器优先级
CSS样式选择器分为4个等级,a.b.c.d,可以以这四种等级为依据确定CSS选择器的优先级. 1.如果样式是行内样式(通过Style=””定义),那么a=12.b为ID选择器的总数3.c为Class ...
- [程序猿入行必备]CSS样式之优先级
专业玩家请移步:http://www.w3.org/TR/CSS2/cascade.html 使用CSS控制页面样式时,常常出现设定的样式被"覆盖",不能生效的情况. 浏览器是根据 ...
- 用JS查看修改CSS样式(cssText,attribute('style'),currentStyle,getComputedStyle)
CSS样式定义方法 大家都知道,在为HTML设置样式的时候,通常有三种方法:内联样式,内部样式表,外部样式表. 1.内联样式: 内联样式表就是在HTML元素中的行内直接添加style属性. <d ...
随机推荐
- hive的学习入门(飞进数据仓库的小蜜蜂)
前言 hive是构建在Hadoop上的数据仓库平台,其设计目标是:使Hadoop上的数据操作与传统的SQL结合,让熟悉sql的开发人员能够轻松的像Hadoop平台迁移. Hive是Facebook的信 ...
- LA 4256
Traveling salesmen of nhn. (the prestigious Korean internet company) report their current location t ...
- POJ 3468 A Simple Problem with Integers(线段树)
题目链接 题意 : 给你n个数,进行两种操作,第一种是将a到b上所有元素都加上c,第二种是查询a到b上所有元素之和输出. 思路 : 线段树,以前写过博客,但是现在在重刷,风格改变,,所以重新写一篇.. ...
- Ajax的进阶学习(一)
在Ajax课程中,我们了解了最基本的异步处理方式.本章,我们将了解一下Ajax的一些全局请求事件.跨域处理和其他一些问题. 加载请求 在Ajax异步发送请求时,遇到网速较慢的情况,就会出现请求时间较长 ...
- 浅析dex文件加载机制
我们可以利用DexClassLoader来实现动态加载dex文件,而很多资料也只是对于DexClassLoader的使用进行了介绍,没有深入讲解dex的动态加载机制,我们就借助于Android4.4的 ...
- amcharts简单封装
只是简单是封装了一下,目前只能输出线图(折现,圆滑线等),柱状图. 代码如下: ;!function(win,$,AC,undefined){ var DDcharts = function(o){ ...
- sql openxml sp_xml_preparedocument xml 中文乱码
DECLARE @xmlText xml ,@idoc int set @xmlText = (select doc from openrowset(bulk 'C:\Word\SRC\WebApp\ ...
- interviewbit :Min Steps in Infinite GridBookmark Suggest Edit
You are in an infinite 2D grid where you can move in any of the 8 directions : (x,y) to (x+1, y), (x ...
- 绑定CPU
处理器的亲和性 软亲和性(affinity) 意味着进程并不会在处理器之间频繁迁移,而 硬亲和性(affinity) 则意味着进程需要在您指定的处理器上运行. 通常 Linux 内核都可以很好地对进程 ...
- 查看程序是否启动或者关闭--比如查看Tomcat是否开启!直接用ps命令查看进程就行了啊
1.查看程序是否启动或者关闭--比如查看Tomcat是否开启!直接用ps命令查看进程就行了啊 2.Tomcat服务器和虚拟机的关系,Tomcat启动运行过程要调用系统环境变量的java_home啊,J ...