Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770
Форумы портала PHP.SU :: Версия для печати :: nth-of-type
Форумы портала PHP.SU » Клиентская разработка » HTML, Дизайн & CSS » nth-of-type

Страниц (1): [1]
 

1. masterlelik - 31 Октября, 2016 - 10:25:57 - перейти к сообщению
есть следующий кусочек html
CODE (html):
скопировать код в буфер обмена
  1. <div class="main">
  2.      <div class="item"></div>
  3.      <div class="item second"></div>
  4.      <div class="item active"></div>
  5.      <div class="item active"></div>
  6.      <div class="item active"></div>
  7.      <div class="item"></div>
  8. </div>

Не получается средствами CSS выделить нужным стилем 2й по счету класс active
пробую так
.main .active:nth-of-type(2){
opacity:0.3;
}

Оно по какой то причине выделяет просто второй див, в данном примере, с классом .second.
Знаю, что nth-of-type указывает на элемент определенного типа, в моем случае div, но я же еще указываю и имя класса

Чего не хватает?
2. Fart - 31 Октября, 2016 - 10:28:38 - перейти к сообщению
к примеру в css так:

.main:active {
(Добавление)
http://htmlbook[dot]ru/css/active
(Добавление)
вот еще примеры
http://www[dot]w3schools[dot]com/cssref/sel_active[dot]asp
3. masterlelik - 31 Октября, 2016 - 11:02:34 - перейти к сообщению
Fart пишет:
к примеру в css так:

.main:active {
(Добавление)
http://htmlbook[dot]ru/css/active
(Добавление)
вот еще примеры
http://www[dot]w3schools[dot]com/cssref/sel_active[dot]asp


Это не то, что требуется, имя класса совпало с селектором, но к селектору active это не имеет никакого отношения.
4. Fart - 31 Октября, 2016 - 12:08:18 - перейти к сообщению
по шаблону так:

.item.second:active (покажет и вернет) или .item.second:nth-of-type(N)(покажет и оставит)

N - укажите порядковый номер элемента
5. masterlelik - 01 Ноября, 2016 - 08:05:22 - перейти к сообщению
Fart пишет:
по шаблону так:

.item.second:active (покажет и вернет) или .item.second:nth-of-type(N)(покажет и оставит)

N - укажите порядковый номер элемента


не понимаю почему вы привязываетесь к second, если речь идет про класс .active или если уточнить то .item.active
6. IllusionMH - 01 Ноября, 2016 - 15:10:15 - перейти к сообщению
masterlelik, nth-of-type учитывает только имя тега, и ему глубоко пофигу на классы и прочее. так что он проверит является ли второй див в своём родителе блоком с классов айтем и эктив.

чтобы выделить второй active - .main .active + .active
7. masterlelik - 01 Ноября, 2016 - 19:52:05 - перейти к сообщению
В общем решение найдено
.item.active + .item.active{

}

 

Powered by ExBB FM 1.0 RC1