定位

静态定位

绝对定位

  • 位置移动特点

    如果一个子元素设置了绝对定位，并且该元素的父元素设置了静态定位或者没有定位，那么当前的子元素是以body标签左上角为参照进行位置移动

    如果一个子元素设置了绝对定位，并且该元素的父元素设置了除静态定位以外的其他定位，那么当前绝对定位的的子元素会以父元素左上角为参照进行位置移动

  • 绝对定位的元素脱标不占位置

  • 可以实现模式转换

相对定位

固定定位

最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成，浏览时请结合常识与多方信息审慎甄别。
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

相关阅读更多精彩内容

  • HTML+CSS(47-72)
    问答题47 /72 常见浏览器兼容性问题与解决方案？ 参考答案 (1)浏览器兼容问题一：不同浏览器的标签默认的外补...
    _Yfling阅读 14,694评论 1赞 92
  • 10.浮动、定位
    一、文档流的概念指什么？有哪种方式可以让元素脱离文档流? 1、文档流指的是元素在排列布局中所占用的位置，具体的说是...
    鸿鹄飞天阅读 4,185评论 0赞 0
  • CSS定位
    在CSS中关于定位的内容是：position:relative | absolute | static | fix...
    feelinghappy618阅读 3,843评论 0赞 0
  • CSS 定位（postion、z-index）
    CSS 定位 CSS有三种基本的定位机制：普通流，浮动，绝对定位(absolute, fixed)：普通流是默认定...
    _空空阅读 11,096评论 0赞 15
  • 任务10 布局 浮动 定位 BFC z-index 清除浮动
    1. 浮动元素有什么特征？对父容器、其他浮动元素、普通元素、文字分别有什么影响? 特征：浮动元素不在普通的文档流中...
    在乎者也阅读 4,965评论 0赞 1

友情链接更多精彩内容