一般浏览器都给body加了外边距,margin:0应该能解决你所遇到的问题。但你很可能又会遇到其他奇怪的现象,比如说p的行高,在不同浏览器上显示不一致,最根本的解决方案还是重置浏览器默认样式。

可以使用目前兼容性较好的 necolas/normalize.css · GitHub

作者:子丶言

链接:https://www.zhihu.com/question/36208082/answer/66823204

来源:知乎

著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。





<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>div</title>
<style> body{
margin:0;
} #div_1{
margin:0 auto;
padding:0;
background:orange;
width:100%;
height:300px;
<!-- overflow:hidden; -->
}
</style>
</head>
<body>
<div id="div_1" > 这是一个div </div>
</body>
</html>

为什么全部width:100%浏览器边缘存在留白?的更多相关文章

  1. safari手机浏览器的width:100%的自适应问题

    Tips: 调试 iPad 或 iPhone 可在设置中启动调试模式,在 Mac 中的 Safari 浏览器 同样开启开发者模式后,进行联机调试.功能彪悍. 最近在做一个页面时,发现在 iPad 的 ...

  2. width:100% 和 max-width:100%; 有区别吗【转藏】

    这个博客是基于“Pelican+Markdown+定制的my-gum主题”的.定制的主题将博文正文页面的 右边栏去掉,这导致在Firefox等浏览器中,正文中大的图片会突破正文块的宽度,高度也得不到限 ...

  3. width:100%缩小窗口时背景图片出现空白bug

    页面容器(#wrap)与页面头部(#header )为100%宽度.而内容的容器(#page)为固定宽度960px.浏览窗口缩小而小于内容层宽度时会产生宽度理解上的差异.如下图所示窗口宽度大于内容层宽 ...

  4. css中width:auto和width:100%的区别是什么

    width的值一般是这样设置的: 1,width:50px://宽度设为50px 2,width:50%://宽度设为父类宽度的50% 3,还有一个值是auto(默认值),宽度是自动的,随着内容的增加 ...

  5. width:100%和width:inherit

    前几天遇到过这么一个问题.我想让子盒子的宽度等于父盒子的宽度.父盒子宽度为一个具体值比如说200px.我将子盒子宽度设为了100%.按道理说应该是可以等于父盒子的宽度的,但结果并没有,而是通栏了.然后 ...

  6. 多方法解决设置width:100%再设置margin或padding溢出的问题

    2019独角兽企业重金招聘Python工程师标准>>> 当设置了父元素的宽度,子元素设置宽度为100%后再在加上子元素上添加padding或margin值就会溢出.举个例子: < ...

  7. width:100%;与width:auto;的区别

    <div> <p>1111</p> </div> div{ width:980px; background-color: #ccc; height:30 ...

  8. css width="100" style ="width:100px" 区别

    1. width="100"是正确的,而 width="100px"是错误的, style = "width:100px"是正确的 2. s ...

  9. width:auto; 和 width:100%;的不同

    width:auto:会将元素撑开至整个父元素width,但是会减去子节点自己的margin,padding或者border的大小.width:100%:会强制将元素变成和父元素一样的宽,并且添加额外 ...

随机推荐

  1. Ubuntu 通过 Live CD 更新grub恢复引导Boot Menu

    工作需要更换主板,但是不想重装电脑. 怎么办呢? 其实并不需要重装电脑,只需要回复boot menu即可. 1. 首先用u盘制作一个ubuntu的live CD(请自行百度),然后通过u盘启动, 选择 ...

  2. 数位DP入门(A - 不要62 HDU - 2089 &&B - Bomb HDU - 3555 )

    题目链接:https://cn.vjudge.net/contest/278036#problem/A 具体思路:对于给定的数,我们按照位数进行运算,枚举每一位上可能的数,在枚举的时候需要注意几个条件 ...

  3. 多校 HDU 6397 Character Encoding (容斥)

    题意:在0~n-1个数里选m个数和为k,数字可以重复选: 如果是在m个xi>0的情况下就相当于是将k个球分割成m块,那么很明显就是隔板法插空,不能为0的条件限制下一共k-1个位置可以选择插入隔板 ...

  4. linux可运行的shell脚本与设置开机服务启动(自己总结)

    完整的ln命令参考:http://www.runoob.com/linux/linux-comm-ln.html ln :创建连接文件 - 默认创建的是硬连接,好比复制 ,但是两个文件会同步 命令:l ...

  5. 最短路径之迪杰斯特拉(Dijkstra)算法

    对于网图来说,最短路径,是指两顶点之间经过的边上权值之和最少的路径,并且我们称路径上的第一个顶点为源点,最后一个顶点为终点.最短路径的算法主要有迪杰斯特拉(Dijkstra)算法和弗洛伊德(Floyd ...

  6. Django-模板继承、包含和静态文件配置

    一.模板继承 模板继承可以减少页面内容的重复定义,实现页面内容的重用 典型应用:网站的头部.尾部是一样的,这些内容可以定义在父模板中,子模板不需要重复定义 block标签:在父模板中预留区域,在子模板 ...

  7. ARKit从入门到精通

    ARKit从入门到精通(10)-ARKit让飞机绕着你飞起来 ARKit从入门到精通(9)-ARKit让飞机跟着镜头飞起来 ARKit从入门到精通(8)-ARKit捕捉平地 ARKit从入门到精通(7 ...

  8. restful API 规范(转)

    1. URI URI 表示资源,资源一般对应服务器端领域模型中的实体类. URI规范 不用大写: 用中杠-不用下杠_: 参数列表要encode: URI中的名词表示资源集合,使用复数形式. 资源集合 ...

  9. 洛谷P1242 新汉诺塔

    传送门啦 首先要将第n个盘子从x到y,那么就要把比n小的盘子全部移到6-x-y,然后将n移到y 仔细想想:6代表的是3根初始柱,3根目标柱. 6-(x+y) 便是我们的中转柱了,因为到这个位置是最优的 ...

  10. SQL中rownum和order by的执行顺序的问题

    在一个SQL中,如果同时使用rownum和order by,会有一个先后顺序的问题. 比如select id1,id2 from t_tablename where rownum<3 order ...