设置了相对定位relative之后，改变top值，如何去掉多余空白？
众所周知，relative和absolute有一个区别在于relative是相对自身定位，而absolute是相对于最近的定位父级定位，而此时的相对定位经过top值改变其在文档流中的位置之后，自身本来的位置依然在文档流中占据位置。
要想解决这个问题，我的想法就是给个margin负值，以减少下方的空白
<body>
<!-- 此时div占据的位置是他自身的高度加上top值为110px -->
<div style="width:100px;height:100px;border:1px solid red;position:relative;top:10px">
</div>
</body>解决这个问题
/*给div设置一个margin负值删除自身最初在文档流中留下的空白*/
div{
margin-top:-10px;
}例：
<body>
<!-- 此时div占据的位置是他自身的高度加上bottom值为110px -->
<div
style=" width:100px;
height:100px;
border:1px solid red;
position:relative;
bottom:10px"
>
</div>
</body>解决：
/*给div设置一个margin负值删除自身最初在文档流中留下的空白*/
div{
margin-bottom:-10px;
}设置了相对定位relative之后，改变top值，如何去掉多余空白？的更多相关文章
- [Android] 对ImageView设置属性scaleType为FIT_START，如何去掉多余空白
当对ImageView设置了属性scaleType为FIT_START时,可以通过调用ImageView的setAdjustViewBounds(true). 即: imageView.setScal ...
- 尽量使用translate而不是改变top/left进行动画（翻译）
前言 本文翻译自 Why Moving Elements With Translate() Is Better Than Pos:abs Top/left,本文有改动,添加了一些作者自己的理解,不当之 ...
- Top值
业务开发中经常会用到元素或者浏览器窗口的各种top值,最近开发组件的过程中也遇到各种问题,因此决定好好总结一下. 常见的top值 scrollTop Element.scrollTop 属性可以获取或 ...
- 再谈 apache设置virtualhost + apache的一些相关设值
首先 要弄懂究竟什么是, vitrual host: 虚拟主机, 他有什么用处? 就是说: 一台计算机(server)中, 通常只是放一个网站/站点 但是 如果机器紧张, 服务器性能比较好,或访问的站 ...
- div+Css绝对定位(absolute)和相对定位(relative)的总结
1.没有外Div的情况下 设置绝对定位(absolute)和相对定位(relative)是没有区别的 2.相对定位占位置 而绝对定位不占位置 会漂浮在别的Div之上 3.若父Div没有设置定位,子Di ...
- java 数据类型：集合接口Collection之List~ArrayList：remove移除；replaceAll改变原有值；sort排序；迭代器listIterator()；
什么是List集合: 特点: 元素有序可重复的集合. 集合中每个元素都有其对应的顺序索引. List集合默认按元素的添加顺序设置元素的索引,索引从0开始. List接口的常用方法: List可以使 ...
- js设置、获取单值cookie和多值cookie
js设置.获取单值cookie和多值cookie,代码如下: var CookieUtil = (function () { var Cookie = function () { // 获取单值coo ...
- c# 根据配置文件路径，设置和获取config文件 appSettings 节点值
/// <summary> /// 获取编译后的主配置文件节点值 /// </summary> /// <param name="key">&l ...
- jquery设置div,文本框 表单的值示例
我们将使用前一章中的三个相同的方法来设置内容: text() - 设置或返回所选元素的文本内容html() - 设置或返回所选元素的内容(包括 HTML标记)val() - 设置或返回表单字段的值 1 ...
随机推荐
- 并发编程~~~多线程~~~守护线程, 互斥锁, 死锁现象与递归锁, 信号量 (Semaphore), GIL全局解释器锁
一 守护线程 from threading import Thread import time def foo(): print(123) time.sleep(1) print('end123') ...
- GetPrivateProfileInt 使用方法
GetPrivateProfileInt ＝>从ini文件取得数值 <参数> lpApplicationName String,指定在其中查找条目的小节.注意这个字串是不区分大小写的 ...
- Python 定时任务的实现方式
本文转载自: https://lz5z.com/Python%E5%AE%9A%E6%97%B6%E4%BB%BB%E5%8A%A1%E7%9A%84%E5%AE%9E%E7%8E%B0%E6%96% ...
- 文件操作NIO
在丑陋的 Java I/O 编程方式诞生多年以后,Java终于简化了文件读写的基本操作. 两个基本组件 文件或者目录的路径: 文件本身. 这块基本都是些记忆性的东西,没什么过多的需要写的地方,用的时候 ...
- 算法问题实战策略 FENCE
地址 https://algospot.com/judge/problem/read/FENCE 开始考虑暴力遍历 #include <iostream> #include <str ...
- DRF--认证和权限
前戏 大家都知道http协议是无状态的,每次发送请求他们怎么知道我们是不是登录过呢?我们可以在用户登录之后给用户一个“暗号”,下次请求的时候带着这个“暗号”来.我们拿自己存的和携带过来的进行对比,如果 ...
- P3525 INS-Inspection
这道题的题面有点问题,如果按照题面做,应该是A不了的,下面引用一下评论里@REM_001的翻译 一棵n个节点的树,行动中心S从1->N.从S出发前往任意一个未标记到的点(沿树上两点的唯一路径走) ...
- javascript中优雅的处理async和await异常
let handler = async function(needErr) { return new Promise((resolve, reject) => { if (needErr) { ...
- Mybatis框架模糊查询+多条件查询
一.ISmbmsUserDao层 //根据姓名模糊查询 public List<Smbms> getUser(); //多条件查询 public List<Smbms> get ...
- 【Linux命令】EOF自定义终止符
EOF自定义终止符用法 我们在脚本中经常会发现使用EOF的情况.EOF可以结合cat命令对内容进行追加.比如:执行脚本的时候,需要往一个文件里自动输入多行内容.如果是少数的几行内容,可以用echo命令 ...