样式的优先级

多重样式(Multiple Style):如果外部样式、内部样式、内联样式同时应用于同一个元素,就是使用多重样式的情况。

一般情况优先级如下:

(外部样式)External style sheet <(内部样式)Internal style sheet <(内联样式)Inline style

有一个例外的情况,就是如果外部样式放在内部样式的后面,则外部样式将覆盖内部样式。

示例如下:

<head>
    <style type="text/css">
      /* 内部样式 */
      h3{color:green;}
    </style>
 
    <!-- 外部样式 style.css -->
    <link rel="stylesheet" type="text/css" href="style.css"/>
    <!-- 设置:h3{color:blue;} -->
</head>
<body>
    <h3>测试!</h3>
</body>

选择器的优先级:

内联样式表的权值最高1000,

ID选择器的权值为100,

class类选择器的权值为10,

html标签选择器的权值为1

CSS优先级法则:

A选择器都有一个权值:权值越大越优先。

B当权值相等时,后出现的样式表设置要优先于先出现的样式表设置。

C网页编写者设置的css样式的优先权高于浏览器设置的样式

D继承的CSS样式不如后来指定的CSS样式

E在同一组属性设置中标有"!important"规则的优先级最大;

<html>
  <head>
    <style type="text/css">
     #redP p{
        /*两个color属性在同一组*/
        color:#00f !important; /* 优先级最大 */
        color:#f00;
     }
    </style>
  </head>
  <body>
     <div id="redP">
       <p>color</p>
       <p>color</p>
     </div>
  </body>
</html>

Css的优先级机制的更多相关文章

  1. CSS 的优先级机制[总结]

    样式的优先级 多重样式(Multiple Styles):如果外部样式.内部样式和内联样式同时应用于同一个元素,就是使多重样式的情况. 一般情况下,优先级如下: (外部样式)External styl ...

  2. CSS 的优先级机制总结

    一.样式优先级: 多重样式(Multiple Styles):如果外部样式.内部样式和内联样式同时应用于同一个元素,就是使用多重样式的情况. 一般情况下,大家都认为优先级是:内联样式 > 内部样 ...

  3. CSS 样式优先级

    首先,选择器优先级顺序 优先级逐级增加的选择器列表: 通用选择器(*) 元素(类型)选择器 类选择器 属性选择器 伪类 ID 选择器 内联样式 !important 规则例外,该样式声明会覆盖CSS中 ...

  4. css中的继承、层叠、样式优先级机制

    一.继承与层叠:

  5. css优先级机制说明

    原文:css优先级机制说明 首先说明下样式的优先级,样式有三种: 1. 外部样式(External style sheet) 示例: <!-- 外部样式 bootstrap.min.css -- ...

  6. CSS 之 样式优先级机制

    多重样式(Multiple Styles):如果外部样式.内部样式和内联样式同时应用于同一个元素,就是使多重样式的情况. 1.一般情况下,优先级从低到高,如下: 浏览器缺省(即浏览器默认) →(外部样 ...

  7. css优先级机制

    所谓CSS优先级,即是指CSS样式在浏览器中被解析的先后顺序.   1.important >(内联样式)Inline style  >(内部样式)Internal style sheet ...

  8. css的优先级 和 权重

    之前写页面样式时,有时会遇到 用多条样式定义规则对同一个元素进行样式设置的时候,当时想到的就是  按css选择器的优先级来搞定这个问题,说实话当时也就只记得 内嵌样式 > id > cla ...

  9. CSS选择器优先级总结

    CSS三大特性-- 继承. 优先级和层叠. 继承:即子类元素继承父类的样式; 优先级:是指不同类别样式的权重比较; 层叠:是说当数量相同时,通过层叠(后者覆盖前者)的样式. css选择符分类 首先来看 ...

随机推荐

  1. CSS根据子元素个数不同定义样式

    近日面试,遇见了一个这样的问题,不会,便记下来. 问题:如何根据子元素个数的不同定义不同的样式? 代码:HTML <ul> <li>1</li> <li> ...

  2. MYSQL:数据库安装 windows

    最近在学习mysql,看到很多人在搭建mysql的时候遇到很多问题,我们在这里不讲安装版的配置过程,因为安装版的配置非常的简单.. windows下配置mysql 首先从官网下载社区版的安装包:最新版 ...

  3. [搬运]在C#使用.NET设计模式的新观点

    原文地址:http://www.dotnetcurry.com/dotnet/1092/dotnet-design-patterns 软件开发有许多设计模式.其中一些模式非常受欢迎.说几乎所有的模式都 ...

  4. re 模块 正则表达式

    re模块(正则表达式)   一.什么是正则表达式 正则就是用一些具有特殊含义的符号组合到一起(称为正则表达式)来描述字符或者字符串的方法.或者说:正则就是用来描述一类事物的规则.(在Python中)它 ...

  5. HDU5447 Good Numbers

    http://acm.hdu.edu.cn/showproblem.php?pid=5447 网上好像只找到java的题解,写完就发一下c++代码咯,顺便纪念一下+存个int128板子 做法可以看tj ...

  6. Codeforces Round #404 (Div. 2)(A.水,暴力,B,排序,贪心)

    A. Anton and Polyhedrons time limit per test:2 seconds memory limit per test:256 megabytes input:sta ...

  7. COGS 1299. bplusa【听说比a+b还要水的大水题???】

    1299. bplusa ☆   输入文件:bplusa.in   输出文件:bplusa.out   评测插件 时间限制:1 s   内存限制:128 MB [题目描述] 输入一个整数n,将其拆为两 ...

  8. BZOJ1226: [SDOI2009]学校食堂Dining

    题目:http://www.lydsy.com/JudgeOnline/problem.php?id=1226 状压dp. f[i][s][k]表示原顺序中前i-1个人都吃了饭,当前状态为s(i及i之 ...

  9. ARM的GPIO配置

  10. 完整CentOS搭建OpenVPN服务详细教程

    一.介绍 1.定义 ① OpenVPN是一个用于创建虚拟专用网络加密通道的软件包,最早由James Yonan编写.OpenVPN允许创建的VPN使用公开密钥.电子证书.或者用户名/密码来进行身份验证 ...