使用HTML标记同级设置嵌套文本的样式

我有两个案例需要正确设计：

<div class="tabs">
  "Tab 1"
   <a href="/1"="tab">Tab 2</a>
</div>

“表1”

及

“表2”

我想在标签1和标签2之间有一个填充。如何在不将文本（非活动选项卡）放入自己的HTML标记的情况下正确指定这些内容

CSS中有没有一种方法可以指定文本类型的like-child

因此，如果选项卡1处于活动状态（第一种情况），我希望在

a

元素（选项卡2）上添加填充：

padding left:10px

如果选项卡2处于活动状态（第二种情况），我希望在

a

元素（选项卡1）上添加填充：

padding right:10px

您可以在css下面尝试

   /* for visited link*/
  a:active {
      padding-left: 10px;
  }

---

您可以添加以下css

.tabs{background:#f2f2f2; border:1px solid #ccc; display:inline-block;}
.tabs.active:nth-child(1){padding-left: 10px}
.tabs.active:nth-child(2){padding-right: 10px}

单击选项卡或预期事件后，您可以应用活动类。在下面的html中，我将活动类添加到两个选项卡中，分别显示填充应用程序

<div class="tabs active">
tab1
</div>

<div class="tabs active">
tab2
</div>

表1
表2

您想在Tab1和Tab2之间加上填充物吗？我不太明白要求，您能解释一下吗more@VivekGupta是的，加了一些notes@melwynpawar确切地说，还添加了注释以使这一点更加清晰。简短的答案是否定的。您可以将文本包装在其自己的

元素中（例如）或者使用JavaScript或jQuery来梳理细节。使用额外的HTML标记，这个问题很容易解决。良好的标记使良好的造型成为可能。

<div class="tabs active">
tab1
</div>

<div class="tabs active">
tab2
</div>