什么是用户代理样式表

CSS的 CSS

乐神奇

2020-03-18

我正在使用Google Chrome浏览器中的网页。它可以正确显示以下样式。

table {
    display: table;
    border-collapse: separate;
    border-spacing: 2px;
    border-color: gray;
}

重要的是要注意，我没有定义这些样式。在Chrome开发者工具上，它表示用户代理样式表代替CSS文件名。

现在，如果我提交表单并且发生一些验证错误，则会得到以下样式表：

table {
    white-space: normal;
    line-height: normal;
    font-weight: normal;
    font-size: medium;
    font-variant: normal;
    font-style: normal;
    color: -webkit-text;
    text-align: -webkit-auto;
}
table {
    display: table;
    border-collapse: separate;
    border-spacing: 2px;
    border-color: gray;
}

在font-size这些新的风格被扰乱我的设计。有什么方法可以强制我的样式表，并在可能的情况下完全覆盖Chrome的默认样式表？

第2051篇《什么是用户代理样式表》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

共12个回答

路易Tony 2020.03.18

将以下代码放入您的CSS文件中

table {
    font-size: inherit;
}

小胖Sam 2020.03.18

我有解决办法检查此：-

错误

<link href="assets/css/bootstrap.min.css" rel="text/css" type="stylesheet">

正确

<link href="assets/css/bootstrap.min.css" rel="stylesheet" type="text/css">

HarryItachi蛋蛋 2020.03.18

每种浏览器都提供一个默认样式表，称为用户代理样式表，以防HTML文件未指定样式表。您指定的样式将覆盖默认设置。由于您尚未为表格元素的框指定值，因此已应用默认样式

小小猿村村 2020.03.18

我遇到了同样的问题，其中之一是浏览器设置了边距，这很烦人，但后来我想出了大多数人所说的那样，这是一个标记错误。

我回去检查了我的部分，我的css链接如下所示：

<link rel="stylesheet" href="ex.css">

我在其中添加了类型，使其如下所示：

<link rel="stylesheet" type="text/css" href="ex.css">

我的问题解决了。

希望对您有所帮助。

Tony西门古一 2020.03.18

回答标题中的问题，什么是用户代理样式表，浏览器中的默认样式集，以下是其中的一些（也是当今网络中最相关的样式）：

壁虎（Firefox）：https : //dxr.mozilla.org/mozilla-central/source/layout/style/res/html.css
铬（Chrome）：https : //chromium.googlesource.com/chromium/src/third_party/+/master/blink/renderer/core/html/resources/html.css
WebKit（Safari）：https：//trac.webkit.org/browser/trunk/Source/WebCore/css/html.css

个人观点，不要与它们抗争，它们具有良好的默认值，例如在rtl / bidi情况下，并且如今是一致的，请重置与您无关的内容，而不是一次全部重置。

老丝GO 2020.03.18

某些浏览器使用自己的方式来读取.css文件。因此，这是正确的解决方法：如果直接在.html源代码中键入命令行，则会击败.css文件，这样，您就直接告诉浏览器该怎么做，并且浏览器处于无法读取的位置.css文件中的命令。请记住，.html文件中写入的命令比.css中的命令强。

小小逆天 2020.03.18

用户代理样式表是浏览器（例如，Chrome，Firefox，Edge等）提供的“默认样式表”，用于以满足“一般显示期望”的方式显示页面。例如，默认样式表将为诸如字体大小，边框和元素之间的间距之类的内容提供基本样式。通常使用重置样式表来处理浏览器之间的不一致。

从规格...

用户代理的默认样式表应以满足对文档语言的一般表示期望的方式来呈现文档语言的元素。〜级联。

有关一般用户代理的更多信息...

https://www.w3.org/TR/UAAG20/#def-user-agent

L西里 2020.03.18

在您自己的CSS中通过Chrome的用户代理样式定义您不想使用的值。

泡芙Gil 2020.03.18

Regarding the concept “user agent style sheet”, consult section Cascade in the CSS 2.1 spec.

User agent style sheets are overridden by anything that you set in your own style sheet. They are just the rock bottom: in the absence of any style sheets provided by the page or by the user, the browser still has to render the content somehow, and the user agent style sheet just describes this.

So if you think you have a problem with a user agent style sheet, then you really have a problem with your markup, or your style sheet, or both (about which you wrote nothing).

西门泡芙Jim 2020.03.18

通过第一行的正确文档类型将文档标记为HTML5，解决了我的问题。