Как я могу исключить один конкретный класс по CSS?

Question

Как я могу исключить один конкретный класс по CSS?

0

У меня есть вложенная вкладка. Вы можете получить доступ к (http://plnkr.co/edit/QbMjutwEIRfHYpgELuIz?p=preview)

Я хочу применить этот класс только .verticaltab классу .verticaltab поэтому я написал css следующим образом:

CSS:

.nav-tabs {
    float: left;
    }
.verticaltab:not(.horizantaltab) .nav-tabs li.active>a{
    background: antiquewhite;
}

HTML:

<tabset vertical="true" type="tabs" class="vertical">
    <tab>
        <tab-heading>A</tab-heading>
        <tabset class="horizantaltab">
            <tab><tab-heading>SONY</tab-heading></tab>
            <tab><tab-heading>VESTEL</tab-heading></tab>
        </tabset>
    </tab>
    <tab>
        <tab-heading>B</tab-heading>
        <tabset class="horizantaltab">
            <tab><tab-heading>SONY</tab-heading></tab>
            <tab><tab-heading>VESTEL</tab-heading></tab>
        </tabset>
    </tab>
</tabset>

Но это не работает. Не могли бы вы мне помочь. Также горизонтальная вкладка применяет цвет фона.

Kle 29 янв. 2016, в 10:22

Источник

1

Вопросы, требующие помощи по коду, должны включать самый короткий код, необходимый для его воспроизведения в самом вопросе . Хотя вы предоставили ссылку на пример, если ссылка станет недействительной, ваш вопрос не будет иметь никакого значения для других будущих пользователей SO с такой же проблемой.
Paulie_D 29 янв. 2016, в 09:08
0

Я не вижу ни одного class = "nav-tabs" в HTML
Carol McKay 29 янв. 2016, в 09:21
0

Это угловая вкладка, поэтому она создается автоматически с помощью классов Nav. Вы можете запустить плункер и осмотреть.
Kle 29 янв. 2016, в 09:22
0

Может быть, я могу написать CSS для Horizantal класса, чтобы написать их. Но это не очень хороший способ.
Kle 29 янв. 2016, в 09:26
0

Ваш HTML говорит, что class="vertical" но ваш CSS говорит, что .verticaltab
N3dst4 29 янв. 2016, в 15:52

Показать ещё 3 комментария

Теги:

angularjs

css

tabs

angular-ui-bootstrap

2 ответа

Ещё вопросы

Вопросы, требующие помощи по коду, должны включать самый короткий код, необходимый для его воспроизведения в самом вопросе . Хотя вы предоставили ссылку на пример, если ссылка станет недействительной, ваш вопрос не будет иметь никакого значения для других будущих пользователей SO с такой же проблемой.
Я не вижу ни одного class = "nav-tabs" в HTML
Это угловая вкладка, поэтому она создается автоматически с помощью классов Nav. Вы можете запустить плункер и осмотреть.
Может быть, я могу написать CSS для Horizantal класса, чтобы написать их. Но это не очень хороший способ.
Ваш HTML говорит, что class="vertical" но ваш CSS говорит, что .verticaltab

Nathaniel Flick · Answer 1 · 2016-01-29T08-16-00.000Z

Я заимствую с сайта MDN (Mozilla Developer Network), чтобы показать, что: не сообщает, что атрибут специально не применяется через другой селектор или класс, но этот класс не должен быть объявлен где-то еще с атрибутами или он не будет влиять на страницу:

p:not(.classy) { color: red; }
body :not(p) { color: green; }

<p>Some text.</p>
<p class="classy">Some other text.</p>
<span>One more text<span>

Но вы объявляете.nav-tabs в css, но не html, чтобы класс никогда не применялся. Что именно ты пытаешься сделать? Если вы хотите что-то стилизовать, настройте это правило, а затем используйте: не создавать свое исключение в правиле.

Karl Dawson · Answer 2 · 2016-01-29T07-45-00.000Z

Если я правильно понимаю Угловой выход, как и у вас, каскад применяется ко всем (:not(.horizantaltab) никогда не сопоставляется). Пытаться:

.verticaltab > .nav-tabs li.active > a {
    background: antiquewhite;
}