CSS/HTML - Firefox 上的填充问题和样式覆盖答案

【问题标题】：CSS/HTML - padding issue on Firefox and style overrideCSS/HTML - Firefox 上的填充问题和样式覆盖
【发布时间】：2011-12-31 13:00:57
【问题描述】：

我的第一期：

由于 Firefox 出现了一些奇怪的问题，我不得不把这些：

margin:0;
padding:0;

在每个带有背景 img 的 div 中，以避免在 Firefox 上出现问题。我对这些没有问题但有时我需要使用 padding-top 在文本和上面之间留出一些距离。

如果我同时使用padding:0 和padding-top:2px，那么问题仍然存在。在修复 Firefox 时如何使用padding-top？

第二个：

我为页面上的所有标签使用了全局 CSS 代码。例如，我在所有标签上都使用了color:FFF。但有时我需要一个特定的链接才能成为color:000。喜欢这个：

<div style="color:000"><a href="#">blabla</a></div>

如您所知，我无法将“blabla”链接设为黑色，因为我已经为<a> 标签应用了样式，因此它将再次变为白色。我怎样才能做到这一点？

【问题讨论】：

【解决方案1】：

要覆盖颜色，您可以向样式表添加一个类，如下所示：

/* Global Link Override */
a:link {
  color:FFF;
}

/* Specific Link Override */
.specialLink a:link {
  color: 000;
}

然后你可以将它应用到链接上，第一个是白色的，第二个是黑色的：

<a href="#">foo</a>
<div class="specialLink"><a href="#">bar</a></div>

【讨论】：

【解决方案2】：

关于padding，可以在前一个div里面多加一个div，只做padding。

<div>
  <div class=PaddingStyle>Content</div>
</div>

这样你就可以保持你的固定 div 完好无损。

关于您的第二个问题，尝试将 !important 添加到第二个样式

a {color:#000 !important;}

【讨论】：

【解决方案3】：

回应#1：

当您说“padding:0”时，您的意思是将所有方向（左、上、右和下）的填充设置为“0”。如果您的“padding-top:2px”出现在您的“padding:0”之前，那么您的“padding-top:2px”将被忽略。

如果你想根据浏览器修改你的样式，那么我推荐css browser select。我以前用过这个，觉得很方便。

【讨论】：

我已经尝试在 padding:0 之后使用 padding-top 但是没有运气！非常感谢您提供的链接，我不知道这种技术存在！使用它将非常容易处理多个浏览器问题。
@xperator：这很奇怪。你在用firebug吗？它非常适合跟踪样式错误。您甚至可以就地编辑大多数值并立即查看效果。