gpt4 book ai didi

html - 页面顶部的空白

转载 作者:技术小花猫 更新时间:2023-10-29 11:36:17 29 4
gpt4 key购买 nike

我的页面顶部有大约 20 像素的空白区域。我已经检查了每个元素,在这个区域没有任何填充或边距。当我检查 body 元素时,它不包括这个空间。当我检查 html 元素时确实包含这个空间。另外,如果我删除

<!DOCTYPE html>

空白消失了。

这是我的主要布局

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Title</title>
<link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<meta name="viewport" content="width=device-width" />
@RenderSection("Css", false)
</head>

<body>
@RenderSection("JavaScript", false)
</body>
</html>

最佳答案

在您的网站样式表的顶部添加一个 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 提到您可以使用通用选择器:* 而不是列出所有元素,这个选择器看起来像 cross browser compatible in all major browsers。 :

* {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}

关于html - 页面顶部的空白,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18772154/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com