Применять стили ко всем элементам, кроме первого типа, с помощью класса

Question

У меня следующая HTML-структура:

<div class="tabs">
    <access type="full">
        <span class="tab">TabOne</span>
    <access>
    <access type="full">
        <span class="tab">TabTwo</span>
    <access>
    <access type="full">
        <span class="tab">TabThree</span>
    <access>
    <access type="full">
        <span class="tab">TabFour</span>
    <access>
</div>

Я бы хотел применить правило margin: 0 0 0 20px; ко всем, кроме первого tab.Я возился с разными вещами, такими как:

.tab + .tab

.tabs .tab:not(:first)

.tabs:not(:first)

Но ничего не получилРабота.Любые идеи относительно того, как я могу сделать это?

Answer 1

Прежде всего, ваша HTML-структура выглядит немного странно, и, насколько я понимаю, вы должны закрыть тег <access></access>.

Итак, он должен выглядеть следующим образом:

<access type="full">
    <span class="tab">TabOne</span>
</access>

и т. д.

Тогда вы сможете применить некоторые CSS, как это:

.tab {
  display: block;
  margin: 0 0 0 20px;
}

access:first-child .tab {
 margin: 0;
}

Также я хотел бы отметить, что span это встроенный Элемент HTML по умолчанию, и вы не сможете применить margin к нему.Чтобы заставить его работать, вы должны переопределить поведение по умолчанию с помощью display: block, чтобы заставить его действовать как block element.