admin 管理员组文章数量: 1086019
html页面缩小后顶部空白,html
html-pag顶部的空白
我的页面顶部有大约20像素的空白。 我检查了每个元素，在此区域中没有填充或空白。 当我检查身体元素时，它不包含该空间。 当我检查html元素时是否包含此空间。 另外，如果我删除
白色空间消失了。
这是我的主要布局
Title@RenderSection("Css", false)
@RenderSection("JavaScript", false)
9个解决方案
55 votes
在网站样式表的顶部添加css重置，不同的浏览器呈现一些默认的边距和填充，也许外部样式表也会执行您不知道的事情，css重置只会初始化一个新的调色板，可以这么说：
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, caption {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
更新：使用通用选择器代替：@Frank提到您可以使用通用选择器：*而不是列出所有元素，并且此选择器看起来在所有主要浏览器中都兼容跨浏览器：
* {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
Brian Ogden answered 2020-07-12T00:12:28Z
4 votes
试试这个
html,
body {
margin: 0;
padding: 0;
height: 100%;
}
mdesdev answered 2020-07-12T00:12:48Z
3 votes
老问题，但我碰到了这个问题。 有时您的文件是UTF-8开头的BOM表，而您的模板引擎对此并不满意。 因此，当包含模板时，您会在页面中插入另一个(不可见的)BOM。
这会在页面的开头导致间隙，浏览器在此处呈现BOM，但对您而言它是不可见的(并且在检查器中，它仅显示为空格/引号。
将模板文件另存为UTF-8(不带BOM)，或更改模板引擎以正确处理UTF8 / BOM文档。
rocketmonkeys answered 2020-07-12T00:13:17Z
3 votes
除了CSS重置之外，我还将以下内容添加到了div容器的CSS中，并对其进行了修复。
position: relative;
top: -22px;
David Hernandez answered 2020-07-12T00:13:37Z
1 votes
如上所述，获得空白可能有很多原因。假设如果您的HTML实体中的div元素为空，也会导致该错误。
例
删除HTML实体
Praveen M P answered 2020-07-12T00:14:05Z
1 votes
如果以上方法均无济于事，请检查是否在某些(以下某些级别)嵌套的DOM元素上设置了margin-top。
当您在调试器中检查margin-top元素本身时，将无法识别它。 仅当您在Chrome Dev Tools元素调试器中展开在padding-top个元素中嵌套的多个元素并检查是否设置了body个元素时，该元素才可见。
当您检查margin-top标签时，以下是网站屏幕截图的上部以及相应的Chrome Dev Tools视图。
这里没有顶部空白的迹象，并且您已经按照上面的答案重新启动了所有特定于浏览器的CSS属性，但是仍然有不需要的空白。
下面是检查正确的嵌套元素时的视图。 可以清楚地看到上面有橙色的margin-top。 这是导致padding-top元素顶部出现空白的原因。
在找到的元素上，如果您需要在其上方有空间但又不希望其泄漏到body标签上方，则用296243961272519981998替换margin-top。
希望有帮助:)
bob-12345 answered 2020-07-12T00:14:53Z
0 votes
检查是否有任何适用于ul，h4等元素的webkit样式。对我而言，这是导致此前后的空白。
-webkit-margin-before: 1.33em;
-webkit-margin-after: 1.33em;
Beetny answered 2020-07-12T00:15:13Z
0 votes
溢出：自动
在2962440740540539991040标签上使用overflow: auto是更清洁的解决方案，并且会很吸引人。
gilbert-v answered 2020-07-12T00:15:37Z
-2 votes
我只是将CSS放入现在可以在代码中工作的
中position: relative; top: -22px;
Siddharth Shukla answered 2020-07-12T00:15:57Z
本文标签： html页面缩小后顶部空白 HTML
版权声明：本文标题：html页面缩小后顶部空白,html 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.roclinux.cn/p/1698422562a299608.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论