1.文档流的概念指什么？有哪种方式可以让元素脱离文档流?
文档楼是指浏览器在渲染时按照元素会自动从左往右，从上往下的流式排列,将标签和内容放入页面中.是页面内容的一种表示顺序.
元素脱离文档流的方法:1.浮动 2.绝对定位.
2.有几种定位方式，分别是如何实现定位的，使用场景如何？
在css中将元素定位可以使用position,属性包括:static(默认),relative(相对定位),绝对定位(absolute),固定位置(fixed),float(浮动定位)
static 当你没有为一个元素(例如div)指定定位方式时，默认为static，也就是按照文档的流式(flow)定位
relative 让一个元素在他本来的位置做一些调整(位移)，我们可以将该元素定位设置为relative，
同时指定相对位移(利用top,bottom,left,right)。但元素仍在文档流中,有着自己的位置.
absolute 同时指定相对位移(利用top,bottom,left,right),元素脱离文档流,父元素必须相对定位.
fixed 定位的参照物总是当前的文档
float 浮动的参数是父元素,并且时自己脱离文档流,他所在的空间将被填补.属性为left,right,一般需要清浮动.
3.absolute, relative, fixed偏移的参考点分别是什么?
absolute 相对于父元素的第一个relative为参考点
relative 相对于自身的之前的位置为为参考点
fixed 相对于整个文档定位
4.z-index 有什么作用? 如何使用?
在有多个定位元素互相重叠时,设置值大的元素在最上层.大概定义为xyz数轴的感觉,z值越大,越靠近屏幕.
5.position:relative和负margin都可以使元素位置发生偏移?二者有什么区别?
position:relative
在原来的位置基础上进行偏移,并未脱离文档流,且在文档流中处于最处的位置,只是不在此处显示.
负margin
负margin 会使块元素的四个外边距以及行内元素的左右外边距向远离父元素中心的位置移动,真正的在文档流中就行了偏移,改变了位置.
6.如何让一个固定宽高的元素在页面上垂直水平居中?
- 先设置宽高,然后设置
margin:Xpx auto;
会在整个浏览器居中 -
position:absolute;
left:50%;right:50%;
再将块元素margin设置为负的宽高的一半.
7.浮动元素有什么特征？对其他浮动元素、普通元素、文字分别有什么影响?
浮动元素会脱离文档流,同时只识别别的浮动元素,会自动对齐.
其他的行内元素或者块元素会围绕浮动元素排列.
8.清除浮动指什么? 如何清除浮动?
将clear:both;添加到需要清浮动的元素上,
clear:both;只对自己有效
网友评论