6.1 周一
二、CSS
实现内容与表现分离，提高代码可重用性和可维护性，
结构层 HTML
表示层 CSS
行为层 JavaScript
1、使用方式：
1.内联方式（行内样式）：直接把css代码用style属性加入到开始标签
<p style =”color:red;”></>
2.内部样式表
直接把css代码添加到头部style标签
<head>
<Style>
P{}
</></>
3.外部样式表
<link rel=”stylesheet”href=””/>stylesheet 意思是样式调用
4.导入式：
<head><style>@import url(my.css);</></>
优先级：行内样式>内部样式>外部样式>导入样式
Css加载方式link和@import区别，为什么不推荐import？
- import只能用于加载css。Link还可以加载其他工作，比如定义rel连接属性
- 加载顺序，当一个页面被加载时，link引用的css会同时被加载，import引用的css会等到页面完全被下载完才被加载，网速慢时明显。
- 兼容性差别，import ie5以上才被兼容，link无此问题
- 使用dom控制样式时的差别，当时用JavaScript控制dom改变样式时，只能用link，因为dom操作元素样式时，用import方式的样式也许还未加载完成
- 使用import方式会增加http请求，影响加载速度。
2、css语法
1.css是以属性/值对形式出现
2.属性与属性值之间以冒号分隔开
3.多个属性用分号隔开
css的注释与HTML快捷键相同
3、Chrome工具调试技巧
Ctrl+混轮可放大缩小调试工具代码大小
左边是html结构，右边是css样式
右边可以改动css样式查看更改后效果
出现划线代码或者叹号都是有问题的，最右侧显示代码位置
4、css基础选择器（重难点）
1.通用选择器、全局选择器
适用范围最广，但优先级最低
例如： *{
color: antiquewhite;
}
2.元素选择器：缺点相同标签的不好设置不同属性
例如：<style>
p{
color: aqua;
}
div{
color: #adff6d;
}
</style>
3.类选择器
类选择器 格式：
.类名{
属性1：属性值1；
。。。。
}
4.ID选择器：
格式
#ID属性名{
属性1：属性值1；
。。。。。
}
5.css选择器命名规范：
1、建议字符组成，可以有下划线_和连接符-,不建议中文
2、不能以数字开头
注意：一个页面中class名字可以重复。不能有重复ID，且ID优先级高于类选择器
优先级：ID选择器>类选择器>标签选择器>通用选择器
2834
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
