CSS三种引入方式
一、三种方式的书写规范
1、行间式
<div style="width: 100px; height: 100px; background-color: red"></div>行间式
1.在标签头部的style属性内 2.属性值满足的是css语法 ?3.属性值用key: value形式赋值,value具有单位 ?4.属性值之间用;隔开 2、内联式
<head> ???<style> ???????div { ???????????width: 100px; ???????????height: 100px; ???????????background-color: red; ???????} ???</style></head>内联式
1.在style标签内(style标签一般作为head的子标签) 2.属性值满足的是css语法 ?3.属性值用key: value形式赋值,value具有单位 4.属性值之间用;隔开(一般独行分开赋值) ?5.格式: 选择器{样式块} <div></div> 3、外联式
file: zero.cssdiv { ???width: 100px; ???height: 100px; ???background-color: red;}file: zero.html<head> ???<\link rel="stylesheet" type="text/css" href="css/zero.css" /></head>外联式
1.在外部css文件中 ?2.属性值满足的是css语法 ?3.属性值用key: value形式赋值,value具有单位 ?4.属性值之间用;隔开(一般独行分开赋值) ?5.格式: 选择器{样式块} ?6.将html与css文件建立联系:html通过link标签链接外部css(一般head中链接) 二、三种方式间的"优先级"
- 与样式表的解析顺序有关
注:三种方式间没有优先级
1.三种方式协同布局: ?2.不重复的属性一定为唯一位置的唯一值 ?3.重复的属性采用覆盖赋值,保留最后位置的属性值 ?4.行间式一定是逻辑上最后被解析的位置(js正常操作的就是行间式) ?5.!important会影响优先级css三种引入方式
原文地址：https://www.cnblogs.com/fxc-520520/p/9679237.html