CSS简介
CSS（Cascading Style Sheets）层叠样式表，又叫级联样式表，简称样式表
1.用于HTML文档中元素样式的定义
实现了将内容与表现分离
提高代码的可重用性和可维护性
2.文件后缀是.css
CSS与HTML之间的关系：
- HTML用于构建网页的结构
- CSS用于构建HTML元素的样式
- HTML是页面的内容组成，CSS是页面的表现
结构层 HTML
表示层 CSS
行为层 JavaScript
CSS样式表
-
内联方式：直接把CSS代码用style属性添加到开始标签中
<p style=“color:red;”>红色字体</p> -
内部样式表：直接把CSS代码添加到头部的style标签中
<head>
<style>
p{color:red;}
</style>
</head> -
外部样式表：<link rel=“stylesheet” href=""/>
-
导入式：
<head>
<style>
@import url(my.css);
</style>
</head>
优先级：行内样式>内部样式>外部样式>导入样式
CSS语法
- css是以属性/值对形式出现
- 属性和属性值之间用冒号（:）连接
- 多对属性之间用分号（;）隔开 如：color：red；
CSS选择器
补充
css加载方式link和@import的区别，推荐使用link
- @import是CSS提供加载样式的一种方式，只能用于加载CSS。link标签除了可以加载CSS外，还可以做很多其它的事情，比如定义rel连接属性等。
- 加载顺序的差别。当一个页面被加载的时候，link引用的CSS会同时被加载，@import引用的CSS会等到页面全部被下载完再被加载。所以有时候浏览@import加载CSS的页面时开始会没有样式（就是闪烁），网速慢的时候会比较明显。
- 兼容性的差别。@import在IE5以上才能识别，而link标签无此问题。
- 使用dom控制样式时的差别。当使用javascript控制dom去改变样式的时候，只能使用link标签，因为dom操作元素的样式时，用@import方式的样式也许还未加载完成。
5.使用@import方式会增加HTTP请求，会影响加载速度，所以谨慎使用该方法。
13万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
