CSS基础

1、CSS全称 Cascading Style Sheets, 层叠样式表。
2、引入CSS方式：
a)内联样式 <h1 style="color:red"></h1>，不推荐使用，HTML代码变得复杂或重复，不利于维护
b)内部样式表，即写在head标签内部的style标签，不推荐使用，会使HTML文件变大
c)link标签引用外部CSS文件，推荐使用，利于维护，避免重复书写相同的属性，理论上可以放在HTML文件内部任何位置，但是一般放在head里，这样可以避免白屏hu
和首屏闪烁（谷歌浏览器会等CSS下载完成之后再渲染页面，而IE则是只要看到HTML就渲染页面）
d)@import引入CSS文件，要注意link与@import的区别：link属于XHTML的标签，不存在兼容性问题，除可引用CSS外还可以引用其他类型文件，而@import是CSS2.1规定的方法，只能引入CSS文件，而且低版本的浏览器无法使用，link标签一般情况是下载完成后再渲染页面，而@import是渲染页面完成之后再加载
3、相对路径与绝对路径
/xxx代表根目录下的xxx是绝对路径，./xxx表示当前目录下的xxx是相对路径，../xxx表示上层文件下的xxx是相对路径，一般上线后的文件路径写相对路径，绝对路径的话可能会出错，一些图片或者音频资源我们可以上传到图床或者七牛等网站，使用外链链接引用也是可以的
4、CSS的书写规范：一般使用小写，class或者id名要有意义推荐使用驼峰写法，要注意缩进，属性值为0的单位省略不写等
5、chrome浏览器检查工具
Element：用于查看和编辑当前页面中的 HTML 和 CSS 元素；编辑html标签和css样式；测试标签的边界条件。
Source：用于查看和调试当前页面所加载的脚本的源文件；断点调试。
Console：JS测试，查看报错
Network：可以看到页面向服务器请求了哪些资源、资源的大小以及加载 资源花费的时间，当然也能看到哪些资源不能成功加载。此外，还可以查看HTTP的请求头，返回内容等。
左上角鼠标小图标快速定位元素节点相对应，小手机图标用来移动端测试调试