css样式表的三种方式(css样式优先级)

　　css样式表的三种方式

css款式表有三种方法：
行内款式表
内部款式表
外部款式表
行内款式表
行内款式便是运用style特点直接把CSS代码添加到HTML的符号中，即作为HTML符号的特点符号存在。
例：
style特点的应用
经过这种方法，能够很简略地对某个元素独自界说款式。
实例：
行内款式表的优缺陷：
长处:
没有了款式表文件，在某些时分能够提升功率;
运用style特点的款式效果会最强，会覆盖掉其他引入方法的相同款式效果。
缺陷:
多个元素难以共享款式，不利于代码复用;
HTML和CSS代码混杂，不利于程序员和搜索引擎阅读。
内部款式表
内部款式表是把css款式写在标签中，并用
简略实例：
外部款式表的优缺陷
长处：
完成了结构与体现的代码彻底别离
方便复用及保护
因为别离到各自独立的文件中，让HTML文件巨细大幅减少了，然后让页面结构更简单被程序员和网络爬虫读懂
对搜索引擎友好，让搜索引擎给页面评分更高，有利于页面搜索引擎排名
外部款式表在用户首次拜访后就被缓存到用户电脑上，下次拜访无需加载
缺陷：
假如款式许多，CSS文件会变的很大查找起来不方便。此外，多一个CSS文件就多一次HTTP请求，在拜访量大的网站中会加剧服务器压力.

css样式优先级

CSS的款式所遵从的基本原则便是：高权重高于低权重，权重相同则后写覆盖先写。
1、CSS选择器优先级
CSS选择器优先级：选择器越小越准确，优先级就越高
选择器优先级
权重值分别是：1000，100，10，1，0
假如是复合的选择器，就比较器权重值。
比方#boxp.tt权重为111
2、多个相同选择器设置的款式冲突时
后设置的优先级高。
如
123
Q：这个标签有两个款式，假如这两个款式都设置背景色，那么到底哪个生效呢？
A：取决于在css款式表中，box和content这两个款式谁在后。而不取决于标签类名谁在前。即生效的是content的款式。
3、！important提高优先级
如：#oDiv{color:red!important;}
代表将其优先级说到无限高。
esp：不主张作为常态使用，特殊情况下使用。且不能针对承继的特点进行优先级提高。
4、特别注意：内部款式表的优先级不一定高于外部款式表。
一般咱们认为，内部款式表的优先级是高于外部款式表的优先级的。可是这仅仅选择器优先级相等的情况下。假如外部款式表和内部款式表一起设置一个款式，且外部款式表的选择器优先级更高，那么将会是外部款式表生效。
如
在外部款式表中设置：.a.b{color:red}；
在内部款式表中设置：.b{color:blue}；
那么最终色彩应该是red，因为此刻外部的选择器优先级高。