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