CSS了解

CSS的全称是什么?

CSS全称Cascading Style Sheets，层叠样式表

CSS有几种引入方式? link 和@import 有什么区别?

有三种引入方式：内联样式，内部样式，外部样式。
link和@import区别：

1. link是XHTML的标签，@import是CSS的语法。
2. 加载顺序的区别，当一个页面被加载的时候（就是被浏览者浏览的时候），link引用的CSS会同时被加载，而@import引用的CSS 会等到页面全部被下载完再被加载。
3. 兼容性的差别，由于@import是CSS2.1提出的所以老的浏览器不支持，@import只有在IE5以上的才能识别，而link标签无此问题。
4. 使用javascript控制dom去改变样式的时候，只能使用link标签，因为@import不是dom可以控制的。

以下这几种文件路径分别用在什么地方，代表什么意思?

相对路径：相对于当前目录的路径
css/a.css 当前目录下css中的a.css
./css/a.css 当前目录下css中的a.css
b.css 当前目录下的b.css
../imgs/a.png 上级目录下imgs中的a.png
绝对路径：本地文件的绝对地址
/Users/hunger/project/css/a.css
网站路径
/static/css/a.css网站路径的相对路径
http://cdn.jirengu.com/kejian1/8-1.png 线上的图片地址

如果我想在js.jirengu.com上展示一个图片，需要怎么操作?

把本地图片上传到一个图床网站，生成一个地址，添加到img标签中展示

列出5条以上html和 css 的书写规范

css书写规范：

• 语法不区分大小写，建议统一使用小写
• 不使用内联style属性定义样式
• 用<link>调用CSS样式
• 尽量避免@import调用方法
• 写CSS的时候块内容缩进
• 属性名冒号后面添加空格
• 属性值是0不写单位
• id和class 建议使用有意义的单词，单词间用分隔符-连接

HTML书写规范：

• 遵循标签语义化原则，避免标签乱用
• 要求结构清晰，结构层级扁平化处理
• 标签用来表达结构，而不是形式样式
• 属性值必须用双引号括起来
• 不使用属性简写
• 不是标签一部分的特殊符号都用编码表示

截图介绍 chrome 开发者工具的功能区

2.png

Elements: 允许我们从浏览器的角度看页面，也就是说我们可以看到chrome渲染页面所需要的的HTML、CSS和DOM对象。此外，还可以编辑这些内容更改页面显示效果；在这里选中某一DOM对象时，网页中相应元素也会被阴影覆盖。我们可以对DOM对象进行修改，修改后结果会在页面实时显示出来
Network: 可以看到页面向服务器请求了哪些资源、资源的大小以及加载资源花费的时间，当然也能看到哪些资源不能成功加载。此外，还可以查看HTTP的请求头，返回内容
Styles: 显示用户定义的样式，比如请求的default.css中的样式，和通过Javasript生成的样式，还有开发者工具添加的样式
Console: 显示各种警告与错误信息，并且提供了shell用来和文档、开发者工具交互