我希望有三个数字(或单词或其他):前两个数字用红框框起来,后两个数字用绿框框起来。所以这些框会重叠。在html/css中是否可能实现这一点?我在代码片段中尝试了一种半法律的方法,希望能够表达出我的意思,但当然它并不起作用。如果可能的话,我想避免使用绝对定位或类似的东西,因为我真的想使用这些元素来标记文本,并计划稍后读取该标记。
这大致上就是我想要的样子:
.red {
border-style: solid;
border-color: red;
padding: 4px;
}
.green {
border-style: solid;
border-color: green;
}
1 2 3 <br /><br />
<span class="red">1 2</span> 3 <br /><br />
1 <span class="green">2 3</span> <br /><br />
<span1 class="red"">1 <span2 class="green">2</span1> 3</span2>