仅使用CSS在HTML元素之间添加空间

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (32)

我有几个相同的HTML元素一个接一个地运行:

<span>1</span>
<span>2</span>
<span>3</span>

我正在寻找在元素之间添加空间的最佳方法

[no space]  [1]  [space 10px]  [2]  [space 10px]  [3]  [no space]

PS:我不想使用任何额外的HTML标记,比如

<span></span>  <span></span>  <span class="last_span"></span>
提问于
用户回答回答于

这样做的好方法是:

span + span {
    margin-left: 10px;
}

每一个span前面都有span(所以,span除了第一个之外)都会有margin-left: 10px

用户回答回答于

只需使用边距或填充。

在你的具体情况下,你margin:0 10px只能在第二使用<span>

UPDATE

这是一个不错的CSS3解决方案(jsFiddle):

span {
    margin: 0 10px;
}

span:first-of-type{
    margin-left: 0;
}

span:last-of-type{
    margin-right: 0;
}

扫码关注云+社区

领取腾讯云代金券