一. 行间式
在标签头部的style属性内
属性值满足的是css语法
属性值用key:value形式赋值 value具有单位
-
属性值之间用;隔开
<div style="width: 100px; height: 100px; background-color: red"></div>
二. 内联式
在style标签内(style标签一般作为head的子标签)
属性值满足的是css语法
属性值用key:value形式赋值 value具有单位
属性值之间用;隔开(一般独行分开赋值)
-
格式:选择器{样式块}
<style> div{ width: 200px; height: 200px; background-color: brown } </style>
三. 外联式
在外部css文件中
属性值满足的是css语法
属性值用key:value形式赋值 value具有单位
属性值之间用;隔开(一般独行分开赋值)
-
格式:选择器{样式块}
6.将html与css文件建立联系:html通过link标签链接外部css(一般head中链接)<link rel="stylesheet" type="text/css" href="css/01.css">
四. 三种引入方式的优先级
注意: 三种方式并没有优先级
- 三种方式协同布局:
- 不重复的属性一定为唯一位置的唯一值
- 重复的属性采用覆盖赋值,保留最后位置的属性值
- 行间式一定是逻辑上最后被解析的位置(js正常操作的就是行间式)
- !important会影响优先级
