CSS基础

1、 CSS的全称是什么?

层叠样式表Cascading Style Sheets

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

• 内联样式
  <h1 style="height:40px;color:red"> </h1>

• 内部样式

  <style type="text/css"> 
    h1{
            color: red;
            font-size: 30px;
    }
  /style>
  

• 外部样式

链接样式
<link rel="stylesheet" type="text/css" href="index.css">
导入样式
在HTML初始化时会被导入到HTML或CSS文件中，成为文件的一部分
<style>
   @import url("style.css");
   @import "style.css";
</style>

link和@import的区别

• link：html标签，不存在兼容性问题，会随着网页的加载而同时被加载，优先级高于@import，可以调用CSS以外的文件
• @import：CSS语法，只能调用CSS文件，兼容IE5以上，等待页面加载完后才能被加载
• 还有使用用dom控制样式时有差别，使用js去控制dom去改变样式时只能用link，@import不是dom可控制的

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

   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 绝对路径，主域名下static文件中css中的a.css文件
   http://cdn.jirengu.com/kejian1/8-1.png  网站路径  

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

• 把图片传到服务器，并用相对路径
• 从网页上找到图片及图片地址，用网站路径
• 上传到图床得到图片链接，然后用网络路径

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

HTML：

• 为每个HTML页面的第一行添加标准模式（standard mode）的声明
• HTML属性应当按照一定的顺序依次排列，来确保代码的易读性
• 标签、属性、属性命名由小写英文、数字和_组成，且所有标签必须闭合，属性值必须用双引号""
• 避免使用中文拼音尽量简易并要求语义化
• 多用无兼容性问题的HTML内置标签

CSS：

• 语法不区分大小写，但建议统一使用小写
• 不使用内联的style属性定义样式
• id和class使用有意义的单词，分隔符建议使用-
• 属性值是0的省略单位
• 块内容缩进
• 属性的冒号后一个空格

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

F12打开开发者工具

菜单栏：

捕获.JPG

Elememt面板：

1.JPG

控制台面板

2.JPG

sources面板

3.JPG

网络面板：

4.JPG

应用面板：

6.JPG

设备模拟器：

7.JPG

网络环境模拟器：

8.JPG