首先需要搞清楚几个基本概念
  1.内嵌样式:
    写在元素标签内的例如:<div style="background-color:red"> </div>
  2.内联样式:
    写在head的style例如:<head>
                  <style>
                      div{
                          background-color:red;
                        }
                  </style>
               </head>
  3.外部样式:
    link标签引入进来的例如:<link rel="stylesheet" href="1.css"/>
4.important:只要设置了important的优先级永远最高。例如:border:1px solid red !important;  
  优先级:!important > 内嵌(标签内)> 内联(style)=外部;
说明:这里很多初学者都会误会内联优先级要高与外部,实际上是相等的。例如:
    <head>
        <link rel="stylesheet" href="1.css"/>//名为1的css文件中有div{background:blue;}
        <style>
          div{
              background-color;red;
         }
       </style>
    </head>
    
此时div的背景色为red;
    <head>
        <style>
          div{

              background-color;red;
         }
       </style>
       <link rel="stylesheet" href="1.css"/>//名为1的css文件中有div{background:blue;}
    </head>
    此时div的背景色为blue;
选择器权重值:内嵌:1000;
    id:0100;
    class或伪类:0010;
    元素或伪元素:0001;
    *:0000;
说明:权重值越大优先级越高;权重值可以累加,但是不会越位,例如:
    嵌套十层div,然后有一个div元素选择器,该选择的权重值为000 10,而不是0010,仍旧比class或伪类选择器的权重值小。
权重值:内嵌(1000)>id(0100)>class/伪类(0010)>元素/伪元素(0001)> * 权重值越高优先级越高。 important永远最高。

写给初学者css优先级问题的更多相关文章

  1. 使用background和background-image对CSS优先级造成影响

    在写一个关于背景图的CSS时候发现一个奇怪的现象, 原图: 如下代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitiona ...

  2. css优先级计算规则

    原文:css优先级计算规则 最近面试了一些求职者,我问css优先级计算规则是怎样的?答曰ID优先级>class>元素选择器,外联样式优先级低于内联样式,内联样式优先级低于行间样式,然后就没 ...

  3. html网页的兼容性和css优先级

    网页不仅是在一个浏览器上显示的网页,也要多考虑其他浏览器的兼容性,火狐.谷歌.搜狗等浏览器总体来说,网页的变化不大,最主要的是还是IE浏览器. color:red\9; IE6  IE7   IE8  ...

  4. CSS优先级和定位

    overflow属性 hidden scroll auto hidden 超出隐藏 scroll 滚动条 Auto 自动 display属性 block inline inline-block non ...

  5. 深入理解css优先级

    为什么要写这篇文章是因为 <style type="text/css"> body h1 { color: green; } html h1 { color: purp ...

  6. css优先级机制

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

  7. CSS优先级问题以及jQuery中的.eq()遍历方法和:eq()选择器的差别

    在写一个TAB选项卡的时候遇到几个有意思的问题,记录下来 先把代码贴出来 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transition ...

  8. CSS优先级的详细解说

    一.什么是CSS优先级? 所谓CSS优先级,即是指CSS样式在浏览器中被解析的先后顺序. 二.CSS优先级规则 既然样式有优先级,那么就会有一个规则来约定这个优先级,而这个“规则”就是本次所需要讲的重 ...

  9. 【学习笔记】CSS优先级规则

    CSS的优先级规则很多地方的说法都是错误的,常见错误说法是inline css>内部样式>外部样式,其实并没有这种规定.真正的CSS优先级确定是通过特性值大小确定的,在特性值大小相同的情况 ...

随机推荐

  1. 设定MS SQL Server 2008定期自动备份

    1.说明 SQL Server2008 本身具有定期自动备份功能,我们只需要通过简单的配置就可以实现非常简单高效的自动备份功能. 2.打开SQL Server代理服务 要实现自动备份功能,首先要保证S ...

  2. python学习笔记:python字符串

    二.python字符串操作符 1. 对象标准类型操作符 Python对象的标准类型操作符一共就三种:对象值的比较.对象身份的比较.布尔类型.其中对象值的比较主要是大于.小于.不等于等的数学比较符:对象 ...

  3. Android sample 之模拟重力感应,加速度

    class SimulationView extends View implements SensorEventListener { // diameter of the balls in meter ...

  4. MySQL的基本数据类型与数据类型优化

    1.选择优化的数据类型的标准 1)更小的通常更好. 一般情况下,应该尽量使用可以正确存储数据的最小数据类型.更小的数据类型通常更快,因为他们占用更少的磁盘.内存和CPU缓存,并且处理时需要的CPU周期 ...

  5. U盘开发之SSD对比

    U盘因其小巧方便,逐步取代了笨重的移动硬盘和光驱,成为最普及的存储介质.现在的主板BIOS也将支持USB启动,作为标准之一,再过几年,光驱时代可能就要终结了.从早期的16MU盘,到现在动辄几个G,U盘 ...

  6. Oracle 索引扫描的4种类型

    根据索引的类型与where限制条件的不同,有4种类型的Oracle索引扫描: 3,4可归一种 (1) 索引唯一扫描(index uniquescan) (2) 索引范围扫描(index range s ...

  7. VMware双网卡实现虚拟机连开发板和Internet

    前面已经介绍过关于VMware产生的虚拟交换机和虚拟网卡,当宿主机拥有两个网卡时,可以让虚拟系统同时实现上网和连接开发板的功能. 首先,在设置中虚拟出两块虚拟机网卡,一块连接VMnet0交换机一块连接 ...

  8. matlab-----均值滤波函数的实现

    均值滤波的原理是对图像以一个区域(方形,圆形)等为模板,对该区域内的数据求平均后赋值给区域的中心 这种滤波方式原理简单,但是在滤波的同时会造成图像模糊. 本文将尝试对matlab中的filter2() ...

  9. Java虚拟机类载入顺序

    Java虚拟机在载入类的时候.先初始化父类静态变量.再初始化子类静态变量.然后载入父类,最后载入子类 public class Parent { static{ System.out.println( ...

  10. Codeforces 433 C. Ryouko&#39;s Memory Note

    C. Ryouko's Memory Note time limit per test 1 second memory limit per test 256 megabytes input stand ...