位置有多少属性?
position定位属性,检索或设置对象的定位方式,一共有四种属性:Static(默认定位) Absolute (绝对定位)Relative (相对定位)Fixed(相对浏览器的绝对定位) Sticky(粘性定位)
一:Static:(默认定位)默认值。位置设置为 static 的元素会正常显示,它始终会处于文档流给予的位置(static元素会忽略任何 top、bottom、left或 right 声明)
二:Absolute:(绝对定位)相对于父级元素的绝对定位,浮出、脱离布局流,它不占据空间,就是我们所说的层,其位置相对于最近的已定位父元素而言的位置,可直接指定“left”、“top”、“right” 以及 “bottom”属性。若父级都没有定位,则以html(根元素)。(层叠的顺序z-index:value)默认情况是按照网页可视窗口(最大的包含块)绝对定位。
三:Relative:(相对定位)是相对于默认位置的相对定位,通过设置left、top、right、bottom值可将其移至相对于其正常位置的地方(相对于自己的开始的位置发生的位置上的移动,【不会破坏正常的布局流,占据空间】)通常是定义包含块的。
四:Fixed:(相对于浏览器的绝对定位)相对浏览器的绝对定位,始终都是相对于浏览器窗口的指定坐标进行定位。此元素的位置可通过 “left”、“top”、“right” 以及"bottom" 属性来规定。不论窗口滚动与否,元素都会留在那个位置。
五:Sticky:(粘性定位)可以看出是position:relative和position:fixed的结合体——当元素在屏幕内,表现为relative,就要滚出显示器屏幕的时候,表现为fixed。
通常使用Absolute属性时需要有相对的包含块
包含块:绝对定位的参照物,告诉元素在什么范围进行偏移。只要元素属性中具有position:relative\absolute\fixed,都可以称为包含快。
上一篇: 定位上下文(补充 css 的 position 属性)
下一篇: HTML5 高级位置(定位)
推荐阅读
-
纤维对象有哪些属性,如何创建?
-
Android 一个应用程序有多少个线程?
-
在Windows中,添加网络位置与映射网络驱动器有何不同?
-
揭秘:有多少人沦陷于隐藏的Bootloader漏洞,引发震惊!
-
游戏里有哪些让人哭笑不得的专业术语?看看这些骚话你见过多少!
-
别被夜间模式骗了!有多少相机在利用它进行偷拍?
-
在JSP中,有多少个内置对象?它们分别是什么呢? - 知乎
-
蓝牙5.0的传输速度有多快?每秒钟能达到多少KB?
-
HTML技巧:锚点定位和预格式化文本的使用" 1. 创建锚点链接以便快速定位目标内容 - 在需要被链接的目标位置添加相应id名 - 示例:<h3 id="two">第2集</h3> - 创建包含目标链接的超链接,只需在href属性中输入#后面跟着id名即可 - 示例:<a href="#two">点击这里跳转到第2集</a> 2. 预格式化文本:使用pre标签来保留原始格式 - pre标签可以用于显示源代码、数学公式等需要保持格式的内容 - 示例: <p> 这是一段预格式化后的文本, 可以看到这里的换行符、空格等都得到了保留。 </p> <pre> 这也是一段预格式化后的文本, 可以看到这里的换行符、空格等都得到了保留。 </pre>
-
关闭@Configuration注解的proxyBeanMethods属性有何作用?