За последние 24 часа нас посетили 21472 программиста и 1025 роботов. Сейчас ищут 705 программистов ...

Меню цвета размеры

Тема в разделе "HTML и CSS", создана пользователем Неугомонный, 6 июл 2019.

  1. Неугомонный

    Неугомонный Активный пользователь

    С нами с:
    10 фев 2018
    Сообщения:
    192
    Симпатии:
    3
    Есть меню
    Код (CSS):
    1. #header .top-menu ul li {float: left;}
    2. #header .top-menu ul li a {display: block;padding: 49px 11.5px 36px;}
    3. #header .top-menu ul li:nth-child(4) a:hover {background: #fff;color: #4a4a4a;}
    и так вышло что ниже блоки которые есть частью выппдающего меню унаследовали все цвета ссылок размеры и т.д с меню
    Код (CSS):
    1. #header .top-menu ul li ul {position: absolute;display: none;width: 1358px;left: 50%;margin-left: -679px;background: #fff;}
    2. #header .top-menu ul li:hover ul {display: block;}
    3. #header .top-menu ul li ul li {display: block;float: none;}
    Как их очистить чтобы выпадающие ссылки не унаследовали цвета размеры , прописать для них отдельно color padding или есть другие варианты?
     
  2. master-web

    master-web Новичок

    С нами с:
    29 май 2019
    Сообщения:
    44
    Симпатии:
    16
    Если правило задано для селектора тега, например
    Код (CSS):
    1. a {
    2.   ...
    3. }
    то придется переопределять стили для ссылок в меню.
    А если используются более сложные селекторы, например
    Код (CSS):
    1. #header.top-menu ul li a {
    2.   ...
    3. }
    то можно просто конкретизировать.
    Например, селектор для ссылок первого уровня меню будет выглядеть так
    Код (CSS):
    1. #header.top-menu>ul>li>a {
    2.   ...
    3. }
    На ссылки дочерних списков указанные здесь стили уже распространяться не будут.
    Так что нужно смотреть в каждом конкретном случае.
     
  3. Dimon2x

    Dimon2x Старожил

    С нами с:
    26 фев 2012
    Сообщения:
    2.199
    Симпатии:
    184
    Есть такое хорошее правильно, не использовать в каскадности больше двух селекторов.