仅使用CSS在HTML元素之间添加空格 [英] Add space between HTML elements only using CSS
问题描述
我有几个相同的HTML元素:
I have several same HTML elements going one after another:
<span>1</span>
<span>2</span>
<span>3</span>
我正在寻找使用 CSS只添加空间BETWEEN元素的最佳方式
[no space] [1] [space 10px] [2] [space 10px] [3] [no space]
另外:
- 请记下您的收据的浏览器兼容性
UPDATE
看起来我不清楚。我不想使用任何其他HTML标记(例如
It looks like I was unclear. I don't want to use ANY ADDITIONAL HTML MARKUP like
<span></span> <span></span> <span class="last_span"></span>
我不想使用表格
我想通过CSS自动定位第一个和最后一个span
I want the first and last span to be targeted automatically by CSS
我不想使用javascript
I don't want to use javascript
可选要求:最后一个字段可以不是父标记的最后一个字符,但它将是父标记的最后一个字符。
Optional requirement: last span can be NOT LAST CHILD of the parent tag, but it will be the LAST SPAN of the parent tag. Spans do not have any other tags between them.
推荐答案
一个很好的方法是:
span + span {
margin-left: 10px;
}
每个 span
由 span
(因此,每个 span
除了第一个)将有 margin-left: 10px
。
Every span
preceded by a span
(so, every span
except the first) will have margin-left: 10px
.
这里有一个更详细的答案类似问题:元素之间的分隔符没有黑客
Here's a more detailed answer to a similar question: Separators between elements without hacks
这篇关于仅使用CSS在HTML元素之间添加空格的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!