Выпадающие ссылки

Question

В заголовке моего сайта у меня есть обычное меню, панель поиска, и я хочу добавить выпадающий список со ссылками на другие веб-сайты. Можете ли вы рассказать мне о выпадающем списке? Я хочу, чтобы он был отзывчивым, поэтому на экранах большего размера это выглядит как: Ссылки на другие сайты -> | и на небольших экранах это выглядит как | -> | Можете ли вы дать мне несколько намеков на это, пожалуйста?

Спасибо вам большое!

Answer 1

Основная структура выпадающего меню может быть что-то вроде этого:

<ul id="menu"> 
    <li><a href="/">Home</a></li> 
    <li> 
     <a href="/company.htm">Company</a> 
     <ul class="sub-menu"> 
      <li><a href="/history.htm">History</a></li> 
     </ul> 
    </li> 
</ul> 

Вы просто должны скрыть подменю с помощью CSS и показать его при наведении родителю <li> тег

Что-то вроде этого:

.sub-menu{ 
    display: none; 
} 

#menu > li:hover > .sub-menu{ 
    display: block; 
} 

Это действительно основы. Другие правила оформления - все зависит от вас! Повеселись.

О отзывчивым меню, который вы хотите, вы, вероятно, следует полагаться на Javascript или, может быть, если ваш сайт имеет только один язык, попробовать что-то с псевдо-элемента: после того, как, дать ему содержание в изменение его с mediaqueries