前端最基础

盒子模型：例如div元素，可以把它看作是一个盒子，它有自己的宽和高。而盒子模型是说每个盒子有自己的width、height、padding、margin、border。width就相当于盒子里面所装东西的宽度，height就相当于盒子里面所装东西的高度，padding就是盒子里所装的东西和盒子之间的距离，可以想象成盒子里所装东西是易碎品，我们用泡沫去填充防止东西破碎，这就是内边距。margin就是盒子与盒子之间的距离。padding和margin的值如果是四个，分别是上右下左，如果是三个，分别是上、左右、下，如果是两个，分别是上下、左右。行内元素只能设置padding-left和padding-right，设置padding-top和padding-bottom没用,对于行内元素，margin也是如此。border是指盒子自身的宽度，可以分别设置盒子的上下左右边框宽度、样式、颜色，也可以分别设置盒子的上左、上右、下左、下右的边框弧度(border-radius)。

 

父级与子级层级问题：如果父级与子级都不设置定位，父级与子级属于同一层级；如果父级设置相对定位，子级设置绝对定位，子级在父级上层。如果父级想要父级显示在上层，则需要调整层级，即设置父级相对定位，子级绝对定位，子级设置z-index：-1(只要比父级层级低就行)。这样就可以让父级显示在上层，子级显示在下层。Z-index只有在定位的元素中使用才会有效果。

清除浮动的方法：(1)空的div元素，设置clear:both；(2)父元素设置overflow:hidden。应该还有很多清除浮动对的方法吧。因为浮动的元素不占位，可能会对其他元素产生影响，所以要清除浮动。

 

 定位问题：分别有相对定位、绝对定位、固定定位。相对定位是相对于元素正常出现在页面中的位置进行定位，元素原本在页面中的位置仍然被它占有。绝对定位是元素相对于有定位元素的父元素进行定位，如果它的父元素没有定位，继续向上进行寻找有定位的父元素。如果没有找到有定位元素的父元素。就一直到向上寻找到body，相对于body进行定位。绝对定位的元素没有占位，就好像飘在页面上一样，这个和浮动不占位一样。

 

 li鼠标悬停抖动问题：如果鼠标悬停，要给li加border，会增加盒子模型的宽和高，所以我们可以先给li加上透明的边框，等到鼠标悬停时，让li的border的颜色改变，这样也就不会改变盒子模型，也就不会出现抖动的问题了。