首先需要搞清楚几个基本概念
　　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. 
						
  2. css优先级计算规则
		
    原文:css优先级计算规则 最近面试了一些求职者,我问css优先级计算规则是怎样的?答曰ID优先级>class>元素选择器,外联样式优先级低于内联样式,内联样式优先级低于行间样式,然后就没 ...
    
		
    3. 
						
  3. html网页的兼容性和css优先级
		
    网页不仅是在一个浏览器上显示的网页,也要多考虑其他浏览器的兼容性,火狐.谷歌.搜狗等浏览器总体来说,网页的变化不大,最主要的是还是IE浏览器. color:red\9; IE6  IE7   IE8  ...
    
		
    4. 
						
  4. CSS优先级和定位
		
    overflow属性 hidden scroll auto hidden 超出隐藏 scroll 滚动条 Auto 自动 display属性 block inline inline-block non ...
    
		
    5. 
						
  5. 深入理解css优先级
		
    为什么要写这篇文章是因为 <style type="text/css"> body h1 { color: green; } html h1 { color: purp ...
    
		
    6. 
						
  6. css优先级机制
		
    所谓CSS优先级,即是指CSS样式在浏览器中被解析的先后顺序.   1.important >(内联样式)Inline style  >(内部样式)Internal style sheet ...
    
		
    7. 
						
  7. CSS优先级问题以及jQuery中的.eq()遍历方法和:eq()选择器的差别
		
    在写一个TAB选项卡的时候遇到几个有意思的问题,记录下来 先把代码贴出来 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transition ...
    
		
    8. 
						
  8. CSS优先级的详细解说
		
    一.什么是CSS优先级? 所谓CSS优先级,即是指CSS样式在浏览器中被解析的先后顺序. 二.CSS优先级规则 既然样式有优先级,那么就会有一个规则来约定这个优先级,而这个“规则”就是本次所需要讲的重 ...
    
		
    9. 
						
  9. 【学习笔记】CSS优先级规则
		
    CSS的优先级规则很多地方的说法都是错误的,常见错误说法是inline css>内部样式>外部样式,其实并没有这种规定.真正的CSS优先级确定是通过特性值大小确定的,在特性值大小相同的情况 ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. Qt 编程训练之七
			
    Qt进程间通信 TCP / IP 跨平台的 QtNetwork模块提供的类网络编程便携式和容易. 它提供了高层类(例如,QNetworkAccessManager, QFtp)使用特定的应用层协议通信 ...
    
			
    2. 
						
  2. 2013腾讯编程马拉松初赛第〇场（3月20日）湫湫系列故事——植树节 HDOJ 4503
			
    题目:http://acm.hdu.edu.cn/showproblem.php?pid=4503 思路:hint from a GOD-COW. 将每一个人模拟成图的一个点,两点连线当且仅当两人是朋 ...
    
			
    3. 
						
  3. 移动网页版Meta 标签
			
    viewport 大部分移动浏览器都接受,比如 Opera Mobile, iPhone, Android, Iris, IE, BlackBerry, Obigo, Firefox 最基本的例子,在 ...
    
			
    4. 
						
  4. I/O事件
			
    I/O事件 最近在研究tornado和gevent,里面涉及了非阻塞I/O.在了解非阻塞I/O之前,需要先了解I/O事件 我们知道,内核有缓冲区.假设有两个进程A,B,进程B想读进程A写入的东西(即进 ...
    
			
    5. 
						
  5. Entity Framewor中的 Migration
			
    http://www.entityframeworktutorial.net/code-first/code-based-migration-in-code-first.aspx = Code bas ...
    
			
    6. 
						
  6. 一种全新的MEMS开关——高性能、快速、低能耗以及双稳态
			
    这种开关最早由申军教授和研究生阮梅春发明,研究生埃里克·朗格卢瓦在简化结构和缩小尺寸上作了探索,黄志林用相同原理做出了MEMS光学镜子开关,曹志良改变设计.材料和工艺后制作出了能同步开关的矩阵.这种M ...
    
			
    7. 
						
  7. QReadWriteLock读写锁的一点测试（它是逻辑锁，并没有与实物相联系），只有锁住了读，才允许再次读，否则一概不允许
			
    QReadWriteLock m_lock; void MyWidget::Button1(){ m_lock.lockForRead(); ShowMessage(tr("111" ...
    
			
    8. 
						
  8. [Leetcode][Python]41: First Missing Positive
			
    # -*- coding: utf8 -*-'''__author__ = 'dabay.wang@gmail.com' 41: First Missing Positivehttps://oj.le ...
    
			
    9. 
						
  9. HDOJ-1007 Quoit Design（最近点对问题）
			
    http://acm.hdu.edu.cn/showproblem.php?pid=1007 给出n个玩具(抽象为点)的坐标 求套圈的半径 要求最多只能套到一个玩具 实际就是要求最近的两个坐标的距离  ...
    
			
    10. 
						
  10. #include <boost/asio.hpp>
			
    TCP服务端和客户端 TCP服务端 #include <iostream> #include <stdlib.h> #include <boost/asio.hpp> ...
    
			
    11.