更改 Firefox 的 CSS答案

【问题标题】：change css for firefox更改 Firefox 的 CSS
【发布时间】：2015-02-22 18:22:01
【问题描述】：

我在本网站和其他网站上广泛阅读了有关如何为不同浏览器更改我的 css 的信息，但我发现没有一种方法有效。

我有一个无序列表，它的列表项在不同的浏览器上以不同的填充量出现。该值设置为 8 px，在 chrome 和 safari 上完美运行。我试过了

ul.titles li {

padding: 8px;
-moz-padding: 7px;
font-family:"Subway", "Courier New", "serif";
font-size:11;
color: #000000;
}

我也试过

ul.titles li {

padding: 8px;
padding: -moz-7px;
font-family:"Subway", "Courier New", "serif";
font-size:11;
color: #000000;
}

这两个都没有效果。当我尝试为 -webkit- 定义一个，为 -moz- 定义一个时，它弄乱了 mozilla 和 chrome。

【问题讨论】：

您应该考虑使用 CSS 重置或规范化器来启动您的 CSS。
这个线程可能是相关的。 stackoverflow.com/questions/5370609/…
Browser specific CSS padding for firefox field的可能重复
我发现问题可能是行高而不是填充 - 不过，我需要一些方法来指定 mozilla 的行高

标签： css firefox browser

【解决方案1】：

尝试在 Mozilla 扩展中添加您的样式：

@-moz-document url-prefix() {
    /* Styles go here */
}

因此，在您的情况下，您可以将以下代码行添加到您的 CSS 样式表中：

@-moz-document url-prefix() {
     ul.titles li {
        padding: 8px;
        font-family:"Subway", "Courier New", "serif";
        font-size:11;
        color: #000000;
     }
}

您可能想尝试的另一个选项是Normalize.css，它可以让浏览器更一致地呈现所有元素并符合现代标准。它仅针对需要规范化的样式。我强烈推荐它。

【讨论】：

这是我尝试过但没有结果的另一个 - 这是我为 url-prefix 输入的内容（我现在正在使用 apache）：@-moz-document localhost { ul.titles li { 填充：6px;字体系列：“地铁”、“新快递”、“衬线”；字体大小：11；颜色：#000000； } }
@JonathanBasile，它不像你那样工作。您只需将 CSS 代码复制到样式表中，将样式放在 url-prefix() 之后的括号中，它将在 FireFox 中格式化。
@JonathanBasile，没关系。它发生在我们最好的人身上。另外，我们都必须从某个地方开始。

【解决方案2】：

我建议不要一一解决每个浏览器，而是使用Normalize.css 让通用元素以通用样式开头。我开发的每个网站都必须具备。

【讨论】：

【解决方案3】：

你可以试试这个：

@-moz-document url-prefix() {
    ul.titles li {
        padding: 7px;
    }
}

当然，写你的 css 可能会添加一个 class 到你的 li

【讨论】：