html布局的常见类型是什么?html的三种布局特色剖析
1、活动规划(html网页默许的规划方式)
特点:
1、块状元素都会在所处的包括元素内自上而下按次序垂直延长分布,由于在默许状态下,块状元素的宽度都为100%。
2、内联元素都会在所处的包括元素内从左到右水平分布显示。(内联元素可不像块状元素这么霸道独占一行)
2、浮动规划(float)
特点:默许规划下,块状元素这么霸道都是独占一行,假如此刻我们想让两个块状元素并排显示。就需要使用float来实现。
如下
div{ width:200px; height:200px; border:2px red solid; float:right; }
3、层模型
特点:假如我想一个div在别的一个div的上面,我们就需要可以使用绝对定位来完成,层模型的三种定位方式relative、absolute、fixed
绝对定位(absolute)
需要设定position:absolute(表示绝对定位),这条语句的作用将元素从文档流中拖出来,
然后使用left、right、top、bottom属性相关于其最接近的一个具有定位属性的父包括块停止绝对定位。
假如不存在这样的包括块,则相关于body元素,即相关于阅读器窗口。
相对定位(relative)
假如想为元素设定层模型中的相对定位,需要设定position:relative(表示相对定位),
它通过left、right、top、bottom属性肯定元素在正常文档流中的偏移位置。
相对定位完成的历程是第一按static(float)方式生成一个元素(并且元素像层一样浮动了起来),
然后相关于之前的位置移动,移动的标的目的和幅度由left、right、top、bottom属性肯定,偏移前的位置保存不动。
牢固定位(fixed)
fixed:表示牢固定位,与absolute定位类型相似,
但它的相对移动的坐标是视图(屏幕内的网页窗口)本身。
由于视图本身是牢固的,它不会随阅读器窗口的滚动条滚动而转变,
除非你在屏幕中移动阅读器窗口的屏幕位置,或改动阅读器窗口的显示大小,
因此牢固定位的元素会始终位于阅读器窗口内视图的某个位置,不会受文档活动影响,
这与background-attachment:fixed?属性功效雷同。
留意:
在使用z-index属性的时候,只要元素使用了position属性的,才具有z-index属性。没有使用position的属性的元素是没有z-index属性的,设定了也没有用
相关文章引荐:
html+css规划的三种方式(天然规划/活动规划/定位规划)_HTML/Xhtml_网页制作
利用HTML和HTML实现常见的规划_html/css_WEB-ITnose
以上就是html规划的常见类型是什么?html的三种规划特点剖析的具体内容,更多请关注百分百源码网其它相关文章!