负边距在让元素产生偏移和 position:relative的区别

负margin会使相邻的浮动元素后inline-block元素产生偏移，而position:relative则不会影响。

使用负margin形成三栏布局的条件？

• 三栏全部浮动。
• 渲染顺序为中左右。
• 左右栏宽度固定。

边距合并

同一文档流中的两个相邻块级元素，会出现外边距合并。

• 上下两个块级元素

文档流的概念，有那种方式可以让元素脱离文档流。

文档流指的是浏览器在渲染页面时，是根据元素在HTML文档中的位置顺序决定排布过程，行内元素从左向右，块级元素从上向下排列。
脱离文档流的两种方式：

• 浮动float，float:left|right;left左浮动，right右浮动。
• 定位position，position:absolute|fixed;

CSS Sprite(雪碧图|精灵图)

雪碧图指将许多很小的icon合成一张大图，通过background-position去定位不同的图片来展示不同的icon。

img标签和CSS背景使用图片在使用场景

页面上固定不变的图片使用CSS背景图，对于可变的内容，图片是和内容相关的使用img图片（验证码，用户头像，广告图片等）。

title和alt属性作用

新建代码库

1
2
3
4
5
6
7
8

# 在当前目录新建一个Git代码库
$ git init

# 新建一个目录，将其初始化为Git代码库
$ git init [project-name]

# 下载一个项目和它的整个代码历史
$ git clone [url]

盒模型包括那些属性

内边距padding，边框border，外边距margin和实际内容。

IE盒模型和W3C盒模型有什么区别？

ie678怪异模式（不加DOCTYPE）使用IE盒模型，宽度=边框+padding+内容。

常见的css选择器

• *通用元素选择器

1
2
3

* {
    font-size:14px;
}

有序列表、无序列表、自定义列表在语义上的区别

• 有序列表，使用数字标记项目
• 无序列表，使用黑点标记项目
• 自定义列表，用来定义和解释的列表
• 有序列表适合各项目之间有顺序关系的情况，无序列表适用于各项目之间没有顺序关系的情况，自定义列表适用于表示项目和其注释的组合。无序列表是使用最多的一种。

如何去除列表的默认样式

line-height作用

设置行高。

检查CSS的兼容性

• 可以在can i use 上查看各浏览器对CSS的兼容情况。
• 在caniuse.com查询inline-block的兼容情况。

样式引入方式

样式有三种引入方式

• 外部样式表

1

<link rel="stylesheet" type="text/css" herf="index.css">`

• 内部样式表（位于标签内部）

1
2
3

<style　type="text/css">
    p {color:red;}
</style>