css地position定位的属性与用法

最新推荐文章于 2023-10-21 09:42:12 发布
最新推荐文章于 2023-10-21 09:42:12 发布
阅读量192 收藏
点赞数
文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/LN101/article/details/105189413
版权

position:reletive（相对定位）
absolute（绝对定位）
static 静态定位（默认属性）
sticky 他就像fixed与reletive地结合体一样，再页面中可以正常排版，当达到一个预期地时候让他去进行固定定位
fixed（固定定位）
center（相对于父元素地中心位置进行定位）
position地值为什么地时候z-index才会生效
当poosition为relitive、absolute、fixed时才会生效，或者不设置position

A-D-M-I-N
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
前端常问面试题总结
YFCookie的博客
01-26 530
面试总结 1、介绍一下你项目中的重难点 2、父子组件传递参数 3、state和props区别 4、props能否被改变，虚拟dom diff算法 5、redux、react生命周期 6、原型原型链，继承的几种方式，前后端联调 7、null和undifined 的区别 ，unll和undifined有没有toString（）方法 8、antd design api form 添加回显 9、flex布局 口述三栏布局 10、position的几个定位区别 2021 01.26 1、自我介绍 2、说一下你做的这
css中position:absolute与position:relative的使用问题
08-27 3607
问题描述： “如果用position来布局页面，父级元素的position属性必须为relative” 这一段经常在网上看到，一开始以为是官方标配，后面在学习的过程中有些疑问，故特意拿出来研究学习了下，发现并非如此，先说结论： 绝对定位的父级节点只要是relative、fixed、absolute其中一个即可实现容器内相对布局，以下是找到的资料印证的。（特别说明，两个position：abs...
定位
why3935308的博客
12-17 335
定位   定位分类：普通流定位、浮动定位、相对定位、绝对定位、固定定位   定位的属性：position规定元素的定位类型，可取值为static/relative(相对定位)/absolute(绝对定位)/foxed(固定定位)；偏移属性，属性名有left/right/top/bottom,用于定义元素框的偏移位置，取值为长度；z-index属性，设置元素的堆叠顺序；   1、相对定位  
神奇的position:relative;
weixin_34408717的博客
07-17 286
我承认我又标题党了，这里想说的是相对定位的设置有时候会起决定性的作用，比如在是否随滚动条移动时的控制。 先上两个示例： position:static; .parent{ display:block; /*position:relative;*/ width:200px; height:100px; overflow:auto; background:lightblue; } .pa...
css中position的定义
caopeng777的专栏
11-20 840
1.absolute： position #father { width:200px; height:100px; position:reletive; background-color:blue; } #son { width:100px; height:50px; position:absolute; background-color:gray; top:20px;
CSS中position属性详解以及定位的说明——实验4
清风小阁
02-27 1526
原文：http://blog.csdn.net/huang_xw/article/details/7300201 实验4 body { margin:20px; padding:0; } .c1 { width:700px; height:100px; background-color:red; } .c2 { margin:10px; width:700px;
css的position属性absolute和relative比较
qq_40859799的博客
12-25 335
**absolute定位：**脱离原来的位置定位。是相对于最近的有定位的父级进行定位；如果没有有定位的父级元素，就相对于文档定位； **relative定位：**保留原来的位置进行定位，相对于自己原来（出生的）位置进行定位； 什么时候用relative？什么时候用absolute？ 如果想定位就要找好参照物； absolute定位：脱离原来的位置定位。是相对于最近的有定位的父级进行定位；如果没有有...
HTML
qk
02-17 286
网页的两种布局 一、header固定不动，左侧菜单绝对定位(absolute)，空出头部和中间板块的位置。固定于当前页面，随着整体页面滑动而消失，中间板块，也用绝对定位，空出头部和左侧菜单的位置，不设置bottom和页面高度的时候，会根据中间板块的内容的多少调整板块高度 html元素主要分为3类，块级元素、内联元素以及内联块级元素。 ①布局实现上板块不动，左侧固定，中间板块的大小随内容的多少改变，当出现滚动条滚动时，左侧内容会随着滚动消失。 二、在布局方式①的基础上，把bottom设置为0，当内容超出时，背
图解CSS中position属性的定位用法
12-13
其中，CSS position 属性可以取5种值：position: absoluteposition: relativeposition: fixedposition: staticposition: inheritstatic 是 position 默认的属性值。任何应用了 position:static 的元素都处于常规文档...
css关于position属性的用法详解(绝对定位和相对定位的混淆)
12-13
挺久没用，有点忘了关于position这个属性的用法，导致在练手的时候又犯了跟最开始新手才会犯的错误，那就是absolute和relative的用法。 在此首先看一下官方对这两个属性值的解释： position 属性值的含义： static ...
DIV CSS布局中position属性用法深入探究
01-21
本文向大家描述一下DIV CSS布局中的position属性的用法，position属性主要有四种属性值，任何元素的默认position的属性值均是static,静态。这节课主要讲讲relative（相对）以及absolute（绝对）。 如何学习DIV+CSS...
CSS中Position定位属性的使用
白瑕 的博客
11-19 2301
CSS中定位属性的使用
浅谈 relative 与 absolute
weixin_45815411的博客
04-15 600
浅谈 relative 与 absolute relative 与 absolute 属于 position 中的属性，positon除了这两种属性外，还有另外两种属性分别是 static 和 fixed。此处我们暂且不谈后两种属性，来谈谈 relative 与 absolute，让我们现在开始吧！ absolute absolute 顾名思义在英文中可译为绝对的，它在CSS中所表现的属性也是如此称为绝对定位； 格式如下： position:absolute; 好了，现在让我们来讲讲它的具体表
CSS绝对定位（absolute）、相对定位（relative）方法（详解）
最新发布
csgojingyu的博客
10-21 1万+
元素可以使用的顶部，底部，左侧和右侧属性定位。然而，这些属性无法工作，除非是先设定position属性。他们也有不同的工作方式，这取决于定位方法。
position:relative的用法
波西塔塔博客
12-25 1万+
position:relative日常应用的时候一般是设置给position:absolute;的父层的, 父层position:relative; 子层position:absolute;的话, 就是依照父层的边界进行定位的, 不然position:absolute 会逐层向上寻找设置了position:relative的元素边界, 直到body元素… 比如要实现商品细节图展示的效果，可以使用如...
div居中（内容+元素：水平+垂直）
weixin_30301183的博客
01-20 59
内容水平居中 text-align: center; 内容垂直居中 /*第一种 行内垂直居中*/ height: 43px; line-height:43px; /*我们将行距增加到和整个div一样高 line-height:43px;然后插入文字，就垂直居中了。*/ /*第二种*/ vertical-ali...
position的8种定位方式
热门推荐
web_xyk的专栏
09-18 3万+
position定位的八种方式： 一、常见/用的四种 1.static positon定位的默认值，没有定位 2.relative 生成相对定位的元素，相对于其正常位置进行定位，一般在子元素设置absoute定位时，给父元素设置relative 元素的位置通过top、right、bottom、left控制，其值的定位起点都是是父元素左上角(这点和absoute、fixed不一...
CSS position 属性(absolute、relative详解)
Sparkjin的专栏
08-07 1748
最近被问到position 属性absolute与relative的区别，感觉自己不是很清楚，故决定来查查看：        w3cschool中定义：     position可能的值 值 描述 absolute 生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。 元素的位置通过 "left", "to
CSS position属性详解：定位规则与实战应用
CSS中的`position`属性是网页布局中至关重要的一个特性，它控制着元素在页面中的定位方式。共有五种主要的定位类型，分别是： 1. **静态定位** (static): 这是所有元素的默认值，意味着元素自然地按照HTML文档流...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值