Jump to content

Macdonald

Newbie
  • Posts

    8
  • Joined

  • Last visited

Macdonald's Achievements

Explorer

Explorer (1/14)

0

Reputation

  1. Точно! Спасибо!
  2. Здраствуйте. Подскажите, пожалуйста, вот есть такой html-код: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Меню</title> <style> ul { border: 1px solid black; } </style> </head> <body> <ul> <li><a href="#">Мчади</a></li> <li><a href="#">Када на мацони</a></li> <li><a href="#">Пахлава</a></li> <li><a href="#">Кчуч</a></li> <li><a href="#">Лилибдж</a></li> </ul> </body> </html> Граница вокруг списка появилась, выглядит оно так: Когда добавляю комментарий, то граница не отображается: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Меню</title> <style> <!-- Комментарий --> ul { border: 1px solid black; } </style> </head> <body> <ul> <li><a href="#">Мчади</a></li> <li><a href="#">Када на мацони</a></li> <li><a href="#">Пахлава</a></li> <li><a href="#">Кчуч</a></li> <li><a href="#">Лилибдж</a></li> </ul> </body> </html> Граница вокруг списка не появляется: Почему так происходит?
  3. ul li a { float: left; display: block; height: 56px; background: yellow repeat-x; font:12px/56px Verdana, Helvetica, Arial, sans-serif; } Не выравнивался, стало так: Можно добавить еще: li span img { border: none; vertical-align:middle; } Отлично работает и даже в IE6! Спасибо, manum!
  4. ul li a { float: left; display: block; height: 56px; background: yellow repeat-x; font:12px/56px Verdana, Helvetica, Arial, sans-serif; } Не выравнивался, стало так:
  5. Вот теперь так: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Сайт для примера</title> <meta name="description" content="" /> <meta name="Keywords" content="" /> <meta name="author" content="hamster.by" /> <link rel="stylesheet" type="text/css" href="style2.css" /> </head> <body> <ul> <li><a href="#">О продукции</a></li> <li><a href="#"><span><img src="images/icon-nashi-obiekti.gif" alt="" /></span>Наши объекты</a></li> <li><a href="#">Оконный калькулятор</a></li> <li><a href="#">Задать вопрос</a></li> <li><a href="#">Контакты</a></li> </ul> </body> </html> body { font-family: Verdana, Helvetica, Arial, sans-serif; font-size: 12px; color: #000000; margin: 0; } ul li{ float: left; list-style-type: none; background: url('images/bg-navbar.gif') repeat-x; } ul li a { float: left; display: block; height: 56px; background: url('images/bg-navbar.gif') repeat-x; padding: auto; } ul li a:hover { background: url('images/bg-hover-link.gif') repeat-x; } img { border: none; }
  6. А как сделать текст по середине кнопки? Cейчас иконка точно такого же размера как и градиент основной, 56px, иконку поставил посередине в редакторе : html <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Сайт для примера</title> <meta name="description" content="" /> <meta name="Keywords" content="" /> <meta name="author" content="hamster.by" /> </head> <body> <ul> <li><a href="#">О продукции</a></li> <li><a href="#"><span><img src="images/icon-nashi-obiekti.gif" alt="" /></span>Наши объекты</a></li> <li><a href="#">Оконный калькулятор</a></li> <li><a href="#">Задать вопрос</a></li> <li><a href="#">Контакты</a></li> </ul> </body> </html> css body { font-family: Verdana, Helvetica, Arial, sans-serif; font-size: 12px; color: #000000; margin: 0; } ul li{ float: left; list-style-type: none; background: url('images/bg-navbar.gif') repeat-x; } ul li a { float: left; display: block; height: 56px; background: url('images/bg-navbar.gif') repeat-x; padding: 0 15px; } ul li a:hover { background: url('images/bg-hover-link.gif') repeat-x; } img { border: none; }
  7. Отлично, спасибо, работает и в IE6!
  8. Добрый день! Подскажите как с помощью маркированного списка сделать такое горизонтальное меню и работало в IE 6? При наведении ссылка выделяется вот таким фоном Само горизонтальное меню имеет фон - градиент: Выделяется ссылка также градиентом: У каждой ссылки в меню справа добавляется иконка (для примера ссылка - наши объекты): Код HTML <div class="navbar"> <ul> <li><a href="#">О продукции</a></li> <li><a href="#">Наши объекты</a></li> <li><a href="#" class="icon-calculator">Оконный калькулятор</a></li> <li><a href="#">Задать вопрос</a></li> <li><a href="#">Контакты</a></li> </ul> </div>
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy