Мобильная версияЯ попытался создать многоуровневое меню в межколоночном разделе моего блога. Мое требование - разместить его под заголовком. Отображается только верхний слой меню, а раскрывающееся меню, а также правое меню раскрывающегося списка меню не видны.
С HTML-кодом все в порядке. У меня есть некоторые сомнения по поводу CSS-кода. Мой код html и CSS выглядит следующим образом:
#ABT-Container { шрифт: обычный 1em Arial, Helvetica, без засечек; фон: #ддд; ширина: 100%; плыть налево; } а { цвет: #333; } .пример { фон: URL-адрес #fff(http://www.gowebbaby.com/wp-content/upl ... signer.gif) в центре справа, без повтора; ширина: 1200 пикселей; высота: 600 пикселей; граница: 1 пиксель #000 сплошная; поле: 20 пикселей авто; отступ: 15 пикселей; радиус границы: 3 пикселя; -moz-border-radius: 3px; -webkit-border-radius: 3px; } #nav { маржа: 0; отступ: 7 пикселей 6 пикселей 0; фон: URL-адрес #0080ff (http://2.bp.blogspot.com/-A86MDTlHnVo/T ... adient.png) повтор-x 0 -110 пикселей; высота строки: 100%; радиус границы: 2em; -webkit-border-radius: 2em; -moz-border-radius: 2em; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .4); -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .4); } #nav li { поле: 0 5 пикселей; отступ: 0 0 8 пикселей; плыть налево; положение: относительное; стиль списка: нет; } /* ссылка на основной уровень */ #навигация { начертание шрифта: жирный; цвет: #e7e5e5; текстовое оформление: нет; дисплей: блок; отступы: 8 пикселей 20 пикселей; маржа: 0; -webkit-border-radius: 1,6em; -moz-border-radius: 1,6em; текстовая тень: 0 1px 1px rgba(0, 0, 0, .3); } #nav a:hover { фон: #000; цвет: #fff; } /* наведение ссылки на основной уровень */ #nav .current a, #nav li:hover>a { фон: URL-адрес #666 (http://2.bp.blogspot.com/-A86MDTlHnVo/T ... adient.png) повтор-x 0 -40 пикселей; цвет: #444; border-top: сплошной 1 пиксель #f8f8f8; -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .2); -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .2); box-shadow: 0 1px 1px rgba(0, 0, 0, .2); текстовая тень: 0 1px 0 rgba(255, 255, 255, 1); } /* наведение ссылки на подуровни */ #nav ul li:наведите курсор, #nav li:hover li a { фон: нет; граница: нет; цвет: #666; -webkit-box-shadow: нет; -moz-box-shadow: нет; } #nav ul a:hover { фон: URL-адрес #0080ff (http://2.bp.blogspot.com/-A86MDTlHnVo/T ... adient.png) повтор-х 0 -100 пикселей ! важно; цвет: #fff !важно; выравнивание текста: по левому краю; -webkit-border-radius: 0; -moz-border-radius: 0; текстовая тень: 0 1px 1px rgba(0, 0, 0, .1); } /*падать */ #nav li:hover>ul { дисплей: блок; } /* список уровня 2 */ #nav ул { дисплей: нет; выравнивание текста: по левому краю; маржа: 0; заполнение: 0; ширина: 185 пикселей; позиция: абсолютная; верх: 35 пикселей; слева: 0; фон: URL-адрес #ddd(http://2.bp.blogspot.com/-A86MDTlHnVo/T ... adient.png) повтор-x 0 0; граница: сплошная 1 пиксель #b4b4b4; -webkit-border-radius: 10 пикселей; -moz-border-radius: 10 пикселей; радиус границы: 10 пикселей; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3); -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .3); box-shadow: 0 1px 3px rgba(0, 0, 0, .3); } #nav ul li { плавающий: нет; маржа: 0; заполнение: 0; } #nav ул а { шрифт-вес: нормальный; текстовая тень: 0 1px 0 #fff; } /* список уровня 3+ */ #nav ул ул { слева: 181 пикселей; верх: -3px; } /* закругленные углы первой и последней ссылки */ #nav ul li:first-child>a { -webkit-border-top-left-radius: 9px; -moz-border-radius-topleft: 9 пикселей; -webkit-border-top-right-radius: 9px; -moz-border-radius-topright: 9 пикселей; } #nav ul li:last-child>a { -webkit-border-bottom-left-radius: 9px; -moz-border-radius-bottomleft: 9 пикселей; -webkit-border-bottom-right-radius: 9px; -moz-border-radius-bottomright: 9px; } /* ясное исправление */ #nav:after { содержание: "."; дисплей: блок; ясно: оба; видимость: скрыта; высота строки: 0; высота: 0; } #nav { отображать: встроенный блок;
- Главная страница
- Поиск по теме Общие Заявления о смерти
- ПОД/ФТ
- KYC
- Сберегательные книжки
- Перенос аккаунтов
