6

任何人都知道如何在 :before 伪元素和内容实际开始的位置之间添加填充？

<ul>
    <li><strong>Name Surname</strong></li>
    <li>+27.082.555.4155</li>
</ul>

我只希望第一个 li 有一个要点，并且只有它有一个强大的元素。

我已经正确使用：

.fr_contactInformation ul li strong:before
{
    content:url(/App_Themes/2011/images/hm_listImage.gif);
}

.fr_contactInformation ul li strong
{
    /*Here is where I am going wrong*/
    padding-left: 50px;
}

谢谢大家！

4

3 回答 3

9

您可以在前面放置填充以在它和元素之间留出空间

.fr_contactInformation ul li strong:before
  {
      content:url(/App_Themes/2011/images/hm_listImage.gif);
      padding-left:50px;
   }
于 2011-02-24T08:42:55.550 回答
4

如果您想按像素控制它，并假设您只想要 FIRST li 上的子弹，这就是您要查找的内容：

.fr_contactInformation ul li.first strong:before
{
    content:url(/App_Themes/2011/images/hm_listImage.gif);
    padding-right: 20px;
}
于 2013-10-09T20:56:01.703 回答
2

感谢亨利将军，但这为整个元素增加了填充。

我试过了，它奏效了：

      .fr_contactInformation ul li strong:before
       {
        content: url(/App_Themes/2011/images/hm_listImage.gif) "  ";

        }

通过在 img url 后面的反向注释中添加一些空格，它在图像元素和内容之间创建了我正在寻找的间隙。

然后我在 li 上使用负边距将其放回原位。

谢谢 ;）

于 2011-02-24T09:01:05.243 回答