Просто наткнулся на это Крис Coyier - http://css-tricks.com/examples/CSSTabs/Как работает эта чистая вкладка CSS?
Может кто-нибудь объяснить мне, как это класс .cur получить применяется к возглавляя вкладки, когда мы нажмем его? В нем нет js.
Он полагается на селектор CSS3: цель. Цель предназначена для разделов на странице html, например http://www.example.com/page#section (SO использует их для перехода к конкретным ответам).
Когда цель выбрана, целевой псевдокласс возьмет верх.
Здесь используются трюки z-index для толкания секций вверх и вниз друг над другом.
Это общий смысл, я не знаю специфики.
Edit -
"дворняжка" класс не применяется вообще. Справа каждая «панель» имеет в себе все три вкладки, но с классом «cur» «hardcoded» для каждой панели. Z-индексация поднимает всю область, с ее вкладками, вверху, создавая эффект. Когда на самом деле это всего лишь 3 divs HTML.
Таким образом, здесь нет никакой магии (за пределами цели: целевой псевдокласс).
Не существует особых особенностей: ': target' выбирает текущую видимую вкладку. Каждая вкладка также содержит заголовки табуляции. И затем он применяет класс 'cur' к' li', который в настоящее время «выбран». – Pindatjuh
Мне было интересно, как класс '.cur' был применен к элементу (при нажатии). Не могли бы вы указать мне строку кода css, которая сделала это? – Anant
@ Не читайте ссылку Уилла. Трюк: ': target'. Я собираюсь прочитать его несколько раз, пока не понял. –