CSS样式表（书写位置）

行内式（内联样式）

通过标签的style属性；来设置元素的样式

<标签名 style="属性1:属性值1;属性2:属性值2;">内容

任何标签都拥有style属性，用来设置行内式

例如：

天下第一

 

style其实就是标签的属性

样式属性和值之间使用 :

多组属性之间用 ; 隔开

只能控制当前的标签和以及嵌套在其中的字标签，造成代码冗余

缺点：

没有实现样式和结构组分离

 

---

内部样式表（内嵌样式表）

将CSS代码集中写在HTML文档的head头部标签中，并且用style标签定义

 

style标签一般位于head标签中，理论上也是可以放在html文档的任何地方

type="text/css"在html5中可以省略

只能控制当前的页面

缺点：

没有彻底分离

 

 

---

外部样式表

将所有的样式放在一个.css为扩展名的外部样式文件中

通过link标签将外部样式表文件链接到html文档中

   

 

link是个单标签

link标签需要放在head头部标签中，并且指定link标签的三个属性

 

 

 

 

 

---

样式书写团队标准：

一种是紧凑型（compact）

h3 { color: deeppink;font-size: 20px;}

一种是展开格式（推荐）

h3 {

    color: deeppink;

    font-size: 20px;    

}

 

 

---

 

 

CSS样式规则

 

总结：

选择器用于指定CSS样式作用的HTML标签，花括号内是对该对象设置的具体样式

属性和属性值以“键值对”的形式出现

属性是对指定的对象设置的样式属性，例如字体大小、文本颜色等。

属性和属性值之间用英文 : 连接。

多个键值对之间用英文 ; 进行区分