Как свойство css не отображает ничего, а блок работает в файле html? - PullRequest
0 голосов
/ 26 апреля 2020

Это мой код, и он работает нормально, но моя проблема в файле css, я очень хорошо знаю свойства * display 1009 * и как он работает, но ниже кода на самом деле это код выпадающего меню, {display: none} означает, что ничего не будет отображаться, а {display: block} используется только для встроенных элементов. Теперь мой вопрос, для каких скрытых свойств отображения при наведении курсора на кнопку DropDown он покажет мне manu, s?

#o2 li a{ background-color: burlywood}

ul li{
    list-style-type: none;
    position: absolute;
}

ul li a{
    text-decoration: none;
    display: block;
}
#o2 li:hover .mainbtn{
    background-color: yellow;
}
#o2 li .dpbtn{
    display: none;
}
#o2 li:hover .dpbtn{
    display: block;
}
<ul id="o2">
    <li><a class="mainbtn" href="#">DropDown</a>
        <div class="dpbtn">
            <a href="#">manu1</a>
            <a href="#">manu1</a>
            <a href="#">manu1</a>
        </div>
    </li>
</ul>

1 Ответ

1 голос
/ 26 апреля 2020

Согласно вашему коду, когда мы зависаем li - .dpbtn имеет свойства display: block;. Когда ваш курсор находится на любом внутреннем элементе, например a - вы все еще зависаете li, потому что a находится внутри li, его части.

enter image description here

ОБНОВЛЕНО .dpbtn - это элемент div. если мы не установим какое-либо свойство displey - по умолчанию оно будет BLOCK, не каждый элемент будет видим по умолчанию, если мы хотим его скрыть - мы должны использовать display none.

После использования display none - мы должны переписать это поведение для: hover action.

Блок отображения работает для всех элементов, если вы задаете это свойство в файле дела. Есть много элементов, которые по умолчанию имеют блочное отображение. Как и h, и p, и div, и секции ... Но если вы заставляете их отображать ничего, может быть, в какой-то момент вам нужно снова сделать их блокированными, поэтому блок отображения работает как внутри, так и на элементах блока, оба @ Атул

...