CSS position 属性

 不定位

static
元素框正常生成。块级元素生成一个矩形框,作为文档流的一部分,行内元素则会创建一个或多个行框,置于其父元素中。
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
相对于自己的原位置定位(占用偏离前原位置)
relative
元素框偏移某个距离。元素仍保持其未定位前的形状,它原本所占的空间仍保留。
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
当前位置绝对定位  (不占位)
absolute
元素框从文档流完全删除,并相对于其包含块定位。包含块可能是文档中的另一个元素或者是初始包含块。元素原先在正常文档流中所占的空间会关闭,就好像元素原来不存在一样。元素定位后生成一个块级框,而不论原来它在正常流中生成何种类型的框。
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
浏览器绝对定位   (不占位)
fixed
元素框的表现类似于将 position 设置为 absolute,不过其包含块是视窗本身。
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

css定位的各属性占位问题的更多相关文章

  1. css进阶----盒子模型,Reset CSS,css浮动,css定位,z-index属性

    盒子模型 把页面上的每一个元素当成一个盒子 由内容,内边距,边框,外边距组成 盒子模型举例 <!DOCTYPE html> <html lang="en"> ...

  2. CSS定位以及z-index属性(层叠性)的详解(转)

    https://blog.csdn.net/weixin_41342585/article/details/79484879

  3. css定位,class属性之间有空格与无空格的区别

    中间有空格的情况 是选择到.class1类下的.class2类子节点,即.class2类的节点要是.class1类子节点 <style> .class1 { color: black; } ...

  4. css3-7 如何让页面元素水平垂直都居中(元素定位要用css定位属性)

    css3-7 如何让页面元素水平垂直都居中(元素定位要用css定位属性) 一.总结 一句话总结:元素定位要用css定位属性,而且一般脱离文档流更加好操作.先设置为绝对定位,上左都50%,然后margi ...

  5. CSS定位属性Position详解

    CSS中最常用的布局类属性,一个是Float(CSS浮动属性Float详解),另一个就是CSS定位属性Position. 1. position:static 所有元素的默认定位都是:position ...

  6. CSS定位的属性值

    关于CSS定位都是老生常谈的问题了,不过有一个问题,最新的属性值在某些网站上并没有被更新到教程上 下面我记录一下 position现在有五个属性值 1.static:静态定位,没有特殊的定位规则,遵循 ...

  7. vue—你必须知道的 js数据类型 前端学习 CSS 居中 事件委托和this 让js调试更简单—console AMD && CMD 模式识别课程笔记(一) web攻击 web安全之XSS JSONP && CORS css 定位 react小结

    vue—你必须知道的   目录 更多总结 猛戳这里 属性与方法 语法 计算属性 特殊属性 vue 样式绑定 vue事件处理器 表单控件绑定 父子组件通信 过渡效果 vue经验总结 javascript ...

  8. css定位

    文档流 所谓的文档流,指的是元素排版布局过程中,元素会自动从左往右,从上往下的流式排列.并最终窗体自上而下分成一行行, 并在每行中按从左至右的顺序排放元素.脱离文档流即是元素打乱了这个排列,或是从排版 ...

  9. CSS 中关于background 属性功能

    background 是 css中的核心属性,我们对他应该充分了解. background-image   定义背景图像  这个属性是我们用的最多的属性 设置背景图像有两个方式 background: ...

随机推荐

  1. 灵活使用 console 让 js 调试更简单

    摘要: 玩转console. 原文:灵活使用 console 让 js 调试更简单 作者:前端小智 Fundebug经授权转载,版权归原作者所有. Web 开发最常用的就是 console.log , ...

  2. loj#6073. 「2017 山东一轮集训 Day5」距离(费用流)

    题意 题目链接 Sol 我们可以把图行列拆开,同时对于行/列拆成很多个联通块,然后考虑每个点所在的行联通块/列联通块的贡献. 可以这样建边 从S向每个行联通块连联通块大小条边,每条边的容量为1,费用为 ...

  3. 当桌面的快捷方式图标左下角出现一个X(叉)的时候应该怎么去掉

    win+r打开运行,然后复制粘贴如下命令就OK辣 cmd /k reg delete "HKEY_CLASSES_ROOT\lnkfile" /v IsShortcut /f &a ...

  4. 使用 CODING 进行 Hexo 项目的持续集成

    本文作者:CODING 用户 - 廖石荣 关于持续集成的概念 持续集成指的是,频繁地(一天多次)将代码集成到主干. 持续集成的过程 如图所示: CI 过程:代码编写 -> 源代码库(GitHub ...

  5. 升级本地部署的CRM到Dynamics 365及部分新特性介绍。

    关注本人微信和易信公众号: 微软动态CRM专家罗勇 ,回复241或者20161226可方便获取本文,同时可以在第一间得到我发布的最新的博文信息,follow me!我的网站是 www.luoyong. ...

  6. java StringBuilder 和 StringBuffer

    1, 相对于 String 来说, StringBuilder 和 StringBuffer 均是可变的 2, StringBuilder 线程不安全, StringBuffer 线程安全 3, 运行 ...

  7. FragmentActivity + Fragment + Fragment使用过程中出现的bug

    FragmentActivity + Fragment(通过hide和show来显示fragment) + Fragment(通过viewpager来显示fragment) 在Activity中 // ...

  8. dotnet core 入门命令

    官方资料: https://docs.microsoft.com/zh-cn/dotnet/core/tools/dotnet-restore?tabs=netcore2x 常规 项目引用 NuGet ...

  9. AlwaysOn配置时在连接步骤时报错(35250)

    1.错误描述 1XX.XXX.XXX.241(主节点) 1XX.XXX.XXX.242(从节点) 添加节点需要在主节点上执行的,错误代码:35250 报错截图 2.网上相关介绍都是怀疑端口5022的问 ...

  10. centos7网络配置方法

    方法一:nmtui    这个是字符界面的图形化网络配置工具 方法二:nmcli 命令行配置 方法三:直接vim /etc/sysconfig/network-scripts/ens----  编辑 ...