css – 正确的位置:伪元素之前

前端之家收集整理的这篇文章主要介绍了css – 正确的位置:伪元素之前前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
什么是正确的定位方式:之前和之后:伪元素,如图片?我已经用一堆不同的方式搞乱了,但是他们似乎都不是很优雅的解决方案。

这是我正在努力做的:

这就是我所做的:

div.read-more a:before {
    content: url('/images/read_more_arrow_sm.png');
    position: absolute;
    top: 4px;
    left: -15px;
}

<div class="read-more">
    <a href="#">Read More</a>
</div>

我基本上只是想使图像与文本对齐。还有另一种办法吗?

如果我可以在图像之前使用填充和边距,这将是完美的,这应该是你所做的。但是由于某种原因,这对我来说并没有奏效。我可以添加水平填充和边距,但顶部和底部填充不做任何事情。为什么会发生这种情况?

解决方法

尝试使用背景而不是内容,并在内容中放置占位符: http://jsfiddle.net/7X7x2/1/

猜你在找的CSS相关文章