正文中的用户代理样式表 (Chrome)答案

【问题标题】：user agent stylesheet (Chrome) in body正文中的用户代理样式表 (Chrome)
【发布时间】：2016-12-04 14:48:18
【问题描述】：

我有一个问题，Chrome 在我的正文上添加了一个用户代理样式表，因此正文比我在 Css 中定义的要大...

我阅读了很多关于用户代理样式表的内容，但我找不到解决方案，它用我的实际 Css 代码覆盖主体用户代理样式表...

Chrome 会向其中添加该文本，当我删除它时，它就像我希望网站一样......（但当我刷新它时，它当然像以前一样） - 你可以在图片中看到它......

Where the red cross is should be no text... then it would work...

html{
	overflow-y: scroll;
}
body {
	background-color: #BDBDBD;
	color: #000000;
	font-family: AcmeFont, 'Lucida Grande', sans-serif;
	text-align: left; 
}

.BODY{
	margin: 0 auto;
	width:70%;
	clear: both;
}

<!DOCTYPE html>
<html>
  
<head>
    <title>Website Title</title>
    <meta charset="UTF-8" >
	<link href="css/style.css" rel="stylesheet" type="text/css">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body class="BODY">
</body>
  
</html>

【问题讨论】：

标签： php css google-chrome stylesheet

【解决方案1】：

据我所知，您无法更改文档正文的宽度。这是一个固定的宽度，即 100%。

我会尝试为您的文档中的内容制作一个包装器，然后操纵包装器的宽度。请尝试以下操作：

<html>
<head>
    <title>Website Title</title>
    <meta charset="UTF-8" >
    <link href="css/style.css" rel="stylesheet" type="text/css">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
    <section class="BODY">
        <!--Put stuff here-->
    </section>
</body>
</html>

希望这会有所帮助:)

【讨论】：

【解决方案2】：

我建议使用像 normalize 或 reset.css 这样的库。

Normalize.css 使浏览器能够更一致地呈现所有元素并符合现代标准。它仅针对需要规范化的样式。

【讨论】：

我尝试这样做，但用户代理仍然存在...但是为什么 Chrome 会在页面上创建用户代理，但在完全相同的不...？ : (