破解 Chrome 和 Firefox 的 css 字体大小答案

【问题标题】：Hack css font-size for Chrome and Firefox破解 Chrome 和 Firefox 的 css 字体大小
【发布时间】：2014-10-30 05:41:18
【问题描述】：

我知道每个浏览器都有默认的css。

我的网站有一个标题，我想在每个浏览器中定义不同的字体大小。

所以我有这种风格：

.FontSize { 14px; }

还有这个元素：

<span class="FontSize">text</span>

对于我要设置的 Chrome：

font-size: 12px;

对于我要设置的firefox：

font-size: 12px;

我读到我破解了 css，所以这是我的 css 文件：

CSS 文件：

.FontSize { 14px; }

/* Chrome */
@media screen and (-webkit-min-device-pixel-ratio:0) {
    .FontSize {font-size:12px;}
}

/* Firefox */
@-moz-document url-prefix() { 
  .FontSize {
     font-size:12px;
  }
}

但它不会改变这些浏览器（Chrome 和 Firefox）中的字体大小..

任何帮助表示赞赏！

【问题讨论】：

即时我想说您可以使用 JavaScript 来读取浏览器 USER AGENT。根据 USER AGENT 您可以为特定浏览器设置 CSS 样式
... 或者您可以使用 CSS 重置来取消浏览器特定的样式，只需设置一次即可。
@alonshmiel 如果你准备好使用 javascript，我有一个现成的答案......
@cuSK，谢谢，但没有 JS。 pbaldauf，谢谢.. RoddyoftheFrozenPeas，CSS 重置导致标题变得奇怪..
@AlonShmiel 我的回答解决了你的问题吗？

标签： html css

【解决方案1】：

chrome 仅适用于 css：

@media screen and (-webkit-min-device-pixel-ratio:0) {
    .FontSize  { font-size: 12px; }
}

firefox 仅适用于 css：

.FontSize,  x:-moz-any-link  { font-size: 12px; }

您的 sn-p 有轻微错误。上面提到的将解决您的问题。

阅读 Paul Rish 的 Browser CSS hacks 了解更多技巧。

【讨论】：