什么是用户代理样式表 [英] What is user agent stylesheet

问题描述

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

I'm working on a web page in Google Chrome. It displays correctly with the following styles.

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

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

It is important to note that I didn't define these styles. On Chrome dev tools, it says 'user agent stylesheet' in place of the CSS file name.

现在，如果我提交表单并发生验证错误，以下样式表：

Now if I submit a form and some validation error occurs, I get the following stylesheet:

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;
}

这些新样式的字体大小会影响我的设计。有没有办法强制我的样式表，如果可能，完全覆盖Chrome的默认样式表？

The font-size from these new styles is disturbing my design. Is there any way to force my stylesheets and if possible, completely overwrite Chrome's default stylesheet?

推荐答案

不同的浏览器设置不同的默认CSS规则。请尝试使用reset.css或normalise.css（Google可以选择其中一个，也可以使用重置与标准化查看差异）以删除这些默认值。

What is the target browser? Different browsers set different default CSS rules. Try including a reset.css or a normalise.css (Google for either one or for "reset vs normalise" to see the differences) to remove those defaults.

这篇关于什么是用户代理样式表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！