weqy Posted August 6, 2011 Report Share Posted August 6, 2011 (edited) Здравствуйте. Решил сделать меню как на Google. Но пока получилось только вот это:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head><title>Пример горизонтального CSS списка</title><style type="text/css">body {margin: 0;} #nav_menu {width: 100%;} #nav_menu ul {list-style: none;} #nav_menu a { float: left; height: 100%; background-color: #2d2d2d; text-decoration: none; text-align: center; padding:7px; font-family: arial; font-size: 10pt; color: #cccccc } #nav_menu a:hover {background-color: #4c4c4c; color: #cccccc;} span {border-top: 2px solid #dd4b39;} </style> </head> <body> <div id="nav_menu"> <ul> <li><a href="#"><span>Поиск</span></a></li> <li><a href="#">Блог</a></li> <li><a href="#">Как помочь</a></li> </ul> </div></body></html>Помогите пожалуйста найти ошибки и недочеты в коде, а также прошу дать несколько советов для продолжения. Буду очень благодарен! Edited August 6, 2011 by weqy Quote Link to comment Share on other sites More sharing options...
0 Vlad Posted August 6, 2011 Report Share Posted August 6, 2011 Добавьте доктайп и приведите картинку того, что вы хотите получить. Quote Link to comment Share on other sites More sharing options...
0 weqy Posted August 6, 2011 Author Report Share Posted August 6, 2011 Добавьте доктайп и приведите картинку того, что вы хотите получить.Доктайп добавил.Картинку приводить не буду, так как живой пример здесь. Quote Link to comment Share on other sites More sharing options...
0 Shotgun Posted August 6, 2011 Report Share Posted August 6, 2011 (edited) body { margin: 0;}#nav_menu ul { list-style: none;}#nav_menu a:link, #nav_menu a:visited { float: left; background: #2d2d2d; text-decoration: none; text-align: center; padding: 7px; font: 10pt arial; color: #cccccc;}#nav_menu a:hover, #nav_menu a:active { background: #4c4c4c; color: #cccccc;}#nav_menu a.active { border-top: 2px solid #dd4b39;}придираюсь Edited August 6, 2011 by Shotgun Quote Link to comment Share on other sites More sharing options...
0 weqy Posted August 7, 2011 Author Report Share Posted August 7, 2011 Помогите пожалуйста.Для удобства вот сделал. Quote Link to comment Share on other sites More sharing options...
0 Vlad Posted August 7, 2011 Report Share Posted August 7, 2011 http://jsfiddle.net/3arzL/1/Цвета слегка поменял. Quote Link to comment Share on other sites More sharing options...
0 weqy Posted August 7, 2011 Author Report Share Posted August 7, 2011 http://jsfiddle.net/3arzL/1/Цвета слегка поменял.СПАСИБО БОЛЬШОЕ!!! Quote Link to comment Share on other sites More sharing options...
Question
weqy
Здравствуйте. Решил сделать меню как на Google. Но пока получилось только вот это:
Помогите пожалуйста найти ошибки и недочеты в коде, а также прошу дать несколько советов для продолжения. Буду очень благодарен!
Edited by weqyLink to comment
Share on other sites
6 answers to this question
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.