2

我正在尝试创建一个纯 CSS 块引用样式。问题是：使用 blockquote:before 创建的引号在 Chrome 中比在 Firefox 和 IE9 中的对齐更低。欢迎任何帮助，我一无所知:(

JSFiddle：http: //jsfiddle.net/w3A7h/3/

有没有一种简单的方法可以只为 Chrome 制定 CSS 规则？

4

1 回答 1

1

在这种情况下，您应该做的第一件事是使用重置样式表使您的元素在默认情况下在浏览器之间呈现更加相同。这将为您节省大量的调试时间，因为它会让很多类似的问题消失。

也就是说，试试这个：

http://jsfiddle.net/AWJyW/

我将引用样式从位于块引用之外的位置更改为位于<p>内部第一个标记之前。然后我将位置更改为相对，将其向左浮动，并设置负边距以阻止它使文本变形。这样做的原因是，虽然 Chrome 和 Firefox 显然不同意从哪里开始绝对定位的边界，但它们就内部边界的位置达成了一致：

blockquote p:first-child:before {
        color: #ededed;
        content: "\201C";
        display: block;
        font-family: Georgia,serif;
        font-size: 110px;
        left: -56px;
        margin-right: -40px;
        position: relative;
        float: left;
        top: -30px;
    }
于 2012-08-15T01:50:59.900 回答