Вернуться   Дизайнерский форум » ВЕБ-ПРОГРАММИРОВАНИЕ » HTML, CSS, JavaScript

Почему меню не выпадает?

Обсуждение темы Почему меню не выпадает? в разделе HTML, CSS, JavaScript, часть категории ВЕБ-ПРОГРАММИРОВАНИЕ; Сделал выпадающее меню через списки HTML при наведении на пункт меню не выпадает Код HTML: <nav class= "menu_hat" > <ul> <li> <a href= ...


Закрытая тема
 
Опции темы
Старый 09.12.2018, 20:46   #1
Сделал выпадающее меню через списки HTML при наведении на пункт меню не выпадает

Код HTML:
	<nav class="menu_hat">
<ul>

	<li><a href="/new">Новости</a></li>

	<li><a href="/menu/office">Офис</a>
<ul >
	<li><a href="/firstsheet">О компании</a></li>
	<li><a href="/catalog/school">Школа</a></li> <!-- Курсы это школа, будут какието семинары для повышения ( это наверно будет общая на всех или разные отделы группы школ по интересам) -->
	<li><a href="/album">Фотокарточки</a></li>
	<li><a href="/filebox">Амбар</a></li>
</ul>
	</li>

	<li><a href="/menu/product">Продукт</a>
<ul >
	<li><a href="/store">Прайс</a></li>
	<li><a href="/catalog/dragee">Драже и крем</a></li>
	<li><a href="/catalog/cosmetic">Косметика</a></li>
	<li><a href="/catalog/drinkmineral">Живые напитки</a></li>
</ul>
	</li>

	<li><a href="/menu/bortnik">Бортник</a>
<ul >
	<li><a href="/event">Численник</a></li>
	<li><a href="/catalog/apiary">Пасека</a></li>
	<li><a href="/catalog/science">Оч'умелые ручки</a></li> <!-- игры для детей (лапта, банки склянки), наукова думка, наука из ничего, просто о сложном чему учили в школе физика математика химия-->
	<li><a href="/catalog/song">Песни стихи</a></li>
</ul>
	</li>

	<li><a href="/menu/contact">Контакт</a>
<ul >
	<li><a href="/location">Визитка</a></li>
	<li><a href="/guestbook">Книга гостей</a></li>
</ul>
	</li>

</ul>
	</nav>
Код:
/* блок меню (возможно надо сделать через вложенность)*/
.menu_hat ul{
	margin: 0px; /* обнуляем внешние поля */
	padding: 0px; /* обнуляем внутренние отступы */
	list-style: none; /* убираем маркеры списков */
}
.menu_hat, .menu_site, .sizon_button {/*  */
	width: 840px;
	margin: 0 auto;

	font: bold 13px/25px Tahoma, Arial, sans-serif; /* шрифт меню, жирный, без засечек ( sans-serif ) (размер px/отступ между строк px)*/
	letter-spacing: 1px; /* отступ между буквами */
	text-transform: uppercase; /* все буквы прописные */
}
.menu_hat ul li ul li{
	float: none; /* отменяем обтикание для внутренних элементов списков, они распологаются в столбик*/
}
.menu_hat a {
	display: block; /* делаем ссылки блоками */

	white-space: nowrap; /* запрещаем перевод строк */
	padding: 2px 35px; /* внутренние отступы (ширина по бокам) (ширина)*/
}
.menu_hat ul li{
	display: block; /* делаем ссылки блоками */
	position: relative; /* относительное позиционирование */
	float: left; /* обтикание одного пункта относительно другова, пункты меню распологаются свлева направо, как и записаны в том порядке */
	border-bottom: 2px solid transparent;
	white-space: nowrap; /* запрещаем перевод строк */
	/*padding: 0px 20px;  внутренние отступы пунктов (высота) (ширина)*/
	margin-right: 20px;
}
.menu_hat a{
	color: #4f576d;
}
.menu_hat ul li ul {
	 display: none; /* скрываем внутренние списки */
}
.menu_hat ul li a:hover .menu_hat ul li ul, .menu_hat ul li.ie6 .menu_hat ul li ul {
	display: block; /* делаем внутренние списки блочными при наведении мыши на внешние элементы LI */
	background: #4f576d; /* цвет фона */	
	margin-left: -30px; /* Сдвигаем подменю влево */

	color: #ffa500; /* цвет текста внутренних ссылок */
	
	position: relative; /* абсолютное позиционирование внутренних списков */
	min-width: 140px; /* минимальная ширина подпунктов */
	width: auto !important; /* для поддержки IE6 */
	width: 140px; /* минимальная ширина подпунктов для IE6 */

	overflow: hidden;

	-webkit-box-shadow: 0 0 7px 0 #99958c; /* тень для разных браузеров */
	-moz-box-shadow: 0 0 7px 0 #99958c; /* тень для разных браузеров */
	box-shadow: 0 0 7px 0 #99958c; /* тень цвет кварцевый*/
}
.menu_hat li ul a:hover, .menu_hat  li ul.ie6 a { /* полоска выделитель */
	color: #4f576d; /* цвет текста внутренних ссылок при наведении курсора на них самих (#58eb51) зелёный цвет сочетается с чёрным*/
	background: #ffa500; /* фон пунктов при наведеии*/
	border-bottom: none; /* убираем подчёркивание у пунктов */
	box-shadow: 0 0 5px 0 #ffbe47;

/* плавное угосание после отведения от пункта (быстро появляется плавно ичезает - надо сделать)*/	
}
.menu_hat a:hover, .menu_hat.ie6 a {
	color: #4f576d; /* цвет текста пунктов при наведении курсора */
	border-bottom: none; /* убираем подчёркивание у подпунктов*/
}
Добавлено через 1 час 4 минуты

помогите пожалуйста

Последний раз редактировалось kostia; 09.12.2018 в 20:46.. Причина: Добавлено сообщение
 
Старый 09.12.2018, 20:46
Ссылки
Старый 10.12.2018, 14:38   #2
А где у тебя JavaScript язык
 
Старый 17.12.2018, 23:05   #3
для чего?

всё, нашел в чём причина, спасибо

пробел убрать перед :
 
Старый 18.12.2018, 14:04   #4
На сколько я понял, ты добился через css. Но проблема может возникнуть, когда ты будешь поверять свой сайт во всех браузерах.
 
Старый 18.12.2018, 14:04
Закрытая тема


Опции темы


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
почему флеш меню не на всех страницах? AJleKc Технологии Flash 6 24.03.2011 08:12
Меню на cms DLE, вид меню, папки (открыты, закрыты) 74ivan74 Кальянная 0 12.08.2009 20:03
Не открывается *.fla!!! Почему??? commander9191 Технологии Flash 10 10.01.2008 11:58
почему со мной все на вы? m_Stasuk Кальянная 16 18.10.2005 12:16
Почему так? vision HTML, CSS, JavaScript 1 11.08.2003 12:30


Текущее время: 02:08. Часовой пояс GMT +4.

Реклама на форуме Условия размещения рекламы
Биржа ссылок Заработай на сайте!
Дизайнерский форум