1. link标签和import标签
link属于html标签，而@import是css提供的
页面被加载时，link会同时被加载，而@import引用的css会等到页面加载结束后加载。
link是html标签，因此没有兼容性，而@import只有IE5以上才能识别。
link方式样式的权重高于@import的。
link支持使用JS修改样式，而@import不支持。
2. BFC
BFC：块级格式化上下文，用于清楚浮动，防止margin重叠等，是一个独立的渲染区域，并且有一定的布局规则。其中比较重要的布局规则有内部box垂直放置，计算BFC的高度的时候，浮动元素也参与计算。
BFC区域不会与float box重叠。
BFC是页面上的一个独立容器，子元素不会影响到外面。
- 那些元素会生成BFC：
根元素
float不为none的元素
position为fixed和absolute的元素
display为inline-block、table-cell、table-caption，flex，inline-flex的元素
overflow不为visible的元素
常见的定位方案：
- 普通流 (normal flow)
在普通流中，元素按照其在 HTML 中的先后位置至上而下布局，在这个过程中，行内元素水平排列，直到当行被占满然后换行，块级元素则会被渲染为完整的一个新行，除非另外指定，否则所有元素默认都是普通流定位，也可以说，普通流中元素的位置由该元素在 HTML 文档中的位置决定。
- 浮动 (float)
在浮动布局中，元素首先按照普通流的位置出现，然后根据浮动的方向尽可能的向左边或右边偏移，其效果与印刷排版中的文本环绕相似。
- 绝对定位 (absolute positioning)
在绝对定位布局中，元素会整体脱离普通流，因此绝对定位元素不会对其兄弟元素造成影响，而元素具体的位置由绝对定位的坐标决定。
3. position属性
固定定位fixed：
元素的位置相对于浏览器窗口是固定位置，即使窗口是滚动的它也不会移动。Fixed定位使元素的位置与文档流无关，因此不占据空间。 Fixed定位的元素和其他元素重叠。
相对定位relative：
生成相对定位的元素，相对于其在正常文档流中的位置进行定位，不脱离文档流。在使用相对定位时，无论是否进行移动，元素仍然占据原来的空间。因此，移动元素会导致它覆盖其它框。
绝对定位absolute：
绝对定位的元素的位置相对于最近的已定位父元素，如果元素没有已定位的父元素，那么它的位置相对于<html>。 absolute 定位使元素的位置与文档流无关，因此不占据空间。 absolute 定位的元素和其他元素重叠。
粘性定位sticky：
元素先按照普通文档流定位，然后相对于该元素在流中的flow root（BFC）和 containing block（最近的块级祖先元素）定位。而后，元素定位表现为在跨越特定阈值前为相对定位，之后为固定定位。
默认定位static：
默认值。没有定位，元素出现在正常的流中（忽略top, bottom, left, right 或者 z-index 声明）。
inherit:
规定应该从父元素继承position 属性的值。
z-index：
数值越大拥有的优先级越高，该属性只对使用了定位的元素（position:relative/absolute/fixed/sticky）有效。
z-index可以为负
-
z-index不起作用的两种情况：
父标签 position属性为relative；
该标签无position属性（不包括static）；
该标签含有浮动(float)属性。
该标签的祖先标签的z-index值比较小
-
解决办法：
第一种: position:relative改为position:absolute；
第二种:浮动元素添加position属性（如relative，absolute等）；
第三种:去除浮动。
第四种:提高父标签的z-index值
初学者一枚，如有问题欢迎指正~
