1. CSS的全称是什么?

CSS（CasCading Style Sheet）全称层叠样式表。

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

内联样式

<p style="border: 1px solid red; text-align: center;">

内部样式表

<style>
    body {
        margin: 0;
    }
</style>

外部样式表

<link rel="stylesheet" type="text/css" href="index.css">
  // 其中type="text/css"可省略

导入样式

@import url(bluish.css);   //可写在内部样式表中，也可写在外部样式表中

link和@import的区别：
1：link是XHTML标签，除了加载CSS外，还可以定义RSS等其他事务；@import属于CSS范畴，只能加载CSS。
2：link引用CSS时，在页面载入时同时加载；@import需要页面网页完全载入以后加载。
3：link是XHTML标签，无兼容问题；@import是在CSS2.1提出的，低版本的浏览器不支持。
4：ink支持使用Javascript控制DOM去改变样式；而@import不支持。

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

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
绝对定位，代表本地文件夹下a.css文件地址
/static/css/a.css
网站路径，当前服务器根目录下的/static/css的a.css文件
http://cdn.jirengu.com/kejian1/8-1.png
网络路径，通过HTTP协议获得8-1.png图片资源

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

①把本地图片上传至某网站，生成一个线上地址，然后在js.jirengu.com中加载
②在本地打开服务器，通过localhost加载这个图片。再将图片放在js.jirengu.com(自己测试时可这样使用）

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

html:

参考http://codeguide.bootcss.com/

布尔型属性可以在声明时不赋值。<input type="text" disabled>
使用 4 个空格做为一个缩进层级，不允许使用 2 个空格或 tab 字符。
对于属性的定义，确保全部使用双引号，绝不要使用单引号。
不要省略可选的结束标签
HTML 属性应当按照以下给出的顺序依次排列，确保代码的易读性。
- class
- id, name
- data-*
- src, for, type, href, value
- title, alt
- role, aria-*

css:

参考https://github.com/fex-team/styleguide/blob/master/css.md

当一个 rule 包含多个 selector 时，每个选择器声明必须独占一行。
>、+、~ 选择器的两边各保留一个空格。
属性选择器中的值必须用双引号包围。
[建议] 选择器的嵌套层级应不大于 3 级，位置靠后的限定条件应尽可能精确。
url() 函数中的路径不加引号。background: url(bg.png);
url() 函数中的绝对路径可省去协议名。
background: url(//baidu.com/img/bg.png) no-repeat 0 0;
RGB颜色值必须使用十六进制记号形式 #rrggbb。不允许使用 rgb()
属性书写顺序
1. Formatting Model （布局方式、位置）相关属性包括：position / top / right / bottom / left / float / display / overflow 等
2. Box Model （尺寸）相关属性包括：border / margin / padding / width / height 等
3. Typographic （文本相关）相关属性包括：font / line-height / text-align / word-wrap 等
4. Visual （视觉效果）相关属性包括：background / color / transition / list-style 等

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

chorme开发者工具面板一共包括：Elements、Console、Sources、Network、Performance、Memory、Application、Security、Audits几个板块（如下图所示）

Elements:查找网页源代码HTML中的任一元素,手动修改任一元素的属性和样式且能实时在浏览器里面得到反馈。
Console:记录开发者开发过程中的日志信息，且可以作为与JS进行交互的命令行Shell。
Sources:断点调试JS。
Network:从发起网页页面请求Request后分析HTTP请求后得到的各个请求资源信息（包括状态、资源类型、大小、所用时间等），可以根据这个进行网络性能优化。
Performance:性能监控
Memory:内存调试工具
Application:记录网站加载的所有资源信息，包括存储数据（Local -
Storage、Session Storage、IndexedDB、Web SQL、Cookies）、缓存数据、字体、图片、脚本、样式表等。
Security:判断当前网页是否安全。
Audits:对当前网页进行网络利用情况、网页性能方面的诊断，并给出一些优化建议。比如列出所有没有用到的CSS文件等。