1

我有一个段落在 chrome 和 firefox 中显示不同。在 chrome 中，我看到样式是由用户代理应用的。

p {
display: block;
-webkit-margin-before: 1em;
-webkit-margin-after: 1em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
}

我试图覆盖这些样式，但仍然对渲染没有影响。有没有办法可以否定差异。以便它们在两个浏览器中以相同的方式呈现。

http://jsfiddle.net/hozefa/hM4Rx/

chrome中的计算markp

color: rgb(102, 102, 102);
display: block;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
height: 95px;
line-height: 19px;
margin-bottom: 13px;
margin-left: 0px;
margin-right: 0px;
margin-top: 3px;
text-shadow: rgb(255, 255, 255) 0px 1px 0px;
width: 526px

FF 中的计算标记

font-family Arial,​Helvetica,​sans-serif
font-size   14px
color   #666666
line-height 19px
margin-top  3px
margin-right    0px
margin-bottom   13px
margin-left 0px
text-shadow #FFFFFF 0px 1px 0px
4

2 回答 2

1

使用css 重置为override浏览器的默认样式。

使用 Eric Meyer 重置的示例

或者您可以尝试使用!important.

甚至修改这些样式：

p{
    -webkit-margin-before: 0em;
    -webkit-margin-after: 0em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
}
于 2013-07-27T21:36:50.247 回答
0

每个用户代理（浏览器）都有自己的内置样式。您看到的是 Chrome，但 Firefox 也有他们的，在这种情况下，与 Chrome 的相同，您可以在他们的开发人员工具中查看。

您覆盖它们的方式是将它们设置为您想要的，两个浏览器都会遵守。

p { margin:1em }

如果这对您不起作用，则其他因素正在影响这一点，但是除非您显示完整的标记，否则我们所说的任何内容都只是一个疯狂的猜测。

于 2013-07-27T21:45:58.137 回答