Html定位
目录
定位:一种高级的布局的方式。你可以将任何的元素,放在页面任意的位置。
position:有五个选值:
static 默认值,没有开启定位
开启定位的情况以下四种:
relative 相对定位
absolute 绝对定位
fixed 固定定位
sticky 粘滞定位
position: relative
开启相对定位后,元素的特点
1、开启相对定位,如果没有设置偏移量,元素的位置是不发生变化
2、相对定位的原点是元素原本在文档流中位置。(就是它位置不会改变top:0;left;0;)
3、开启相对定位后,元素的等级会提高。(就是可以盖上面)
4、开启相对定位, 元素不会脱离文档流,
元素的性质不会改变,也就是块元素还是块元素,行内元素还是行内元素。
偏移量就是top,left,bottom,right。最好设置时一个垂直方向,和一个水平方向的最好。
position:absolute。开启
开启定位后,元素特点
1.开启绝对定位后,元素会脱离文档流。图一是未开启,图二是开启的。
图一
图二
2.开启绝对定位,元素的性质会发生变化,块元素不会独占一行,行内元素也可以设置宽高。
3.开启绝对定位,元素要发生位置变化,需要偏移量。
4.绝对定位相对于其包含块发生偏移。
5.绝对定位提高语速等级。.
包含块:
1、没有定位的时候,包含块就是其父元素
2、如果有定位的时候,包含块就是离元素最近的开启了定位的祖先元素,如果没有其祖先元素都没有开启定位,其包含块就是html根标, 所以我们管html也叫初始包含块
这篇好文章是转载于:学新通技术网
- 版权申明: 本站部分内容来自互联网,仅供学习及演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,请提供相关证据及您的身份证明,我们将在收到邮件后48小时内删除。
- 本站站名: 学新通技术网
- 本文地址: /boutique/detail/tanhfhkjfj
-
photoshop保存的图片太大微信发不了怎么办
PHP中文网 06-15 -
Android 11 保存文件到外部存储,并分享文件
Luke 10-12 -
《学习通》视频自动暂停处理方法
HelloWorld317 07-05 -
word里面弄一个表格后上面的标题会跑到下面怎么办
PHP中文网 06-20 -
photoshop扩展功能面板显示灰色怎么办
PHP中文网 06-14 -
微信公众号没有声音提示怎么办
PHP中文网 03-31 -
excel下划线不显示怎么办
PHP中文网 06-23 -
excel打印预览压线压字怎么办
PHP中文网 06-22 -
怎样阻止微信小程序自动打开
PHP中文网 06-13 -
TikTok加速器哪个好免费的TK加速器推荐
TK小达人 10-01