CSS
CSS全称为 Cascading Style Sheets,译为层叠样式表。CSS有三种样式:内联样式,内嵌样式,外联样式。
内联样式
内联样式通过HTML元素的style属性来设置CSS样式,语法如下:
?style="CSS属性:CSS属性值";
示例代码:
?
?
?
? ? 内联样式
? ?
? ? ?
? ? ?
? ?
? ? 启嘉班
? ? ?
?
* 内联样式的缺点: 只对当前元素有效, 导致CSS代码可能出现冗余
内嵌样式表
通过HTML元素的style属性来设置CSS样式,语法如下:
?
示例代码:
?
?
?
? ? ?
? ? ?
? ? ?
? ? ?内嵌样式
? ? ?
?
?
? ? ?19级启嘉班
?
?
优点: 相对于内联样式
*通过CSS选择器定位HTML页面中一个或一类元素
缺点:相对于内联样式
* 将CSS代码嵌入到HTML页面中,只能对当前HTML页面有效
* 编码的风格不符合编码原则中的低耦合
* 导致CSS代码可能出现冗余
外联样式
通过HTML元素的元素来设置CSS样式表
1.创建一个CSS文件,用来存储CSS样式内容
2.在HTML页面中通过元素引入外部指定的CSS文件
元素:
* 作用: 用来引入HTML页面外部的资源
属性:
* rel属性: 用来设置外部资源与当前HTML页面的关系
* href属性: 用来设置引入外部资源的路径(相对路径和绝对路径)
语法结构如下:
?
示例代码:
?
优点: 相对于内嵌样式表和内联样式
* 将CSS样式与HTML页面进行分离(低耦合)
* 不会出现内嵌样式表或内联样式产生的代码冗余
缺点: 可能对HTML页面的加载造成负担,导致性能下降
下一节更新CSS选择器