Search the Community
Showing results for tags 'горизонтальное меню'.
-
Всем привет! Я только начинаю учиться верстать и хочу узнать,как сделать вот такое меню? Самое главное,что бы оно было адаптивным. Заранее спасибо)
- 2 replies
-
- адаптивное
- горизонтальное меню из картинок
-
(and 6 more)
Tagged with:
-
Подскажите, для чего горизонтальное меню оборачивать в ul>li, если можно обойтись только дескриптером '<a>'? Только чтобы меню формально было списком? В чем подвох и почему никто так не делает? Привожу ниже мой код и скриншот готового меню. <!DOCTYPE html><title>Test Page</title><meta charset = "utf-8"><link rel = "stylesheet" href = "style.css"><div> <nav> <a href="#">Home</a> <a href="#">Portfolio</a> <a href="#">About</a> <a href="#">Contacts</a> <a href="#">Forum</a> <a href="#">Support</a> <a href="#">Callback</a> </nav> <header></header></div>body { margin: 0; padding: 0; font-family: Arial;}body div { background: #eee; height: 1000px;}nav { display: block; background: #333; height: 34px;}nav a { color: white; display: block; float: left; line-height: 34px; padding: 0px 20px; text-decoration: none; font-size: 12px;}nav a:hover { background: #29b4f9;}header { background: #29b4f9; display:block; height: 150px;} P.S.: Может еще какие-то ошибки в коде есть, или можно написать как-то лучше — буду рад если не промолчите.
- 24 replies
-
- меню
- горизонтальное меню
-
(and 2 more)
Tagged with:
-
Здравствуйте,столкнулся с проблемой,не могу выровнять в горизонтальном меню картинки,сейчас это выглядит вот так http://slayers.zz.vc/ ,а нужно что бы ссылки были под картинками. <style> .menu_head{float:right;margin-top:17px;display:table;}.menu_head li{display:table-row;float:left; }.menu_head li a{display:table-cell;text-align:center;}</style> <ul class="menu_head"><li><a href="#"><img src="img/home.png"/>Про комплекс</a></li><li><a href="#"><img src="img/key.png"/>Квартири</a></li><li><a href="#"><img src="img/shopping.png"/>Покупцям</a></li><li><a href="#" class="current"><img src="img/gallery.png"/>Галерея</a></li><li><a href="#"><img src="img/speaker.png"/>Новини</a></li><li><a href="#"><img src="img/email.png"/>Контакти</a></li></ul>