Русский
<head> <script> startList = function() { if (document.all&&document.getElementById) { navRoot = document.getElementById("nav"); for (i=0; i<navRoot.childNodes.length; i++) { node = navRoot.childNodes[i]; if (node.nodeName=="LI") { node.onmouseover=function() {this.className+=" over";} node.onmouseout=function() {this.className=this.className.replace(" over" , "");} } } } } window.onload=startList; </script> <style> body { шрифт: обычный 11 пикселей verdana; } ul {маржа: 0; заполнение: 0; стиль списка: нет; ширина: 150 пикселей; /* Ширина пунктов меню */ border-bottom: 1px Solid #ccc; } ul li { позиция: относительная; } li ul { позиция: абсолютная; слева: 149 пикселей; /* Устанавливаем ширину меню на 1 пиксель меньше */ top: 0; дисплей: нет; } /* Стили для пунктов меню */ ul li a { display:block; текстовое оформление: нет; цвет: #777; фон: #fff; /* Ошибка IE6 */ отступ: 5 пикселей; граница: 1 пиксель, сплошная #ccc; нижняя граница: 0; } /* Исправляем IE. Скрыть из IE Mac */ * html ul li { float: left; высота: 1%; } * html ul li a { height: 1%; } /* Конец */ ul li a:hover { color: #E2144A; фон: #f9f9f9; } /* Стили наведения */ li ul li a { padding: 2px 5px; } /* Стили подменю */ li:hover ul, li.over ul { display:block; } /* Магия */ </style> </head> <body> <ul id="nav"> <li><a href="#">Home</a></li> <li>< a href="#">О</a> <ul> <li><a href="#">История</a></li> <li><a href="#">Команда</a ></li> <li><a href="#">Офисы</a></li> </ul> </li> <li><a href="#">Услуги</a> < 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> </li> <li><a href="#">Свяжитесь с нами</a> <ul> <li><a href="#">Великобритания</a> </li> <li><a href="#">Франция</a></li> <li><a href="#">США</a></li> <li><a href ="#">Австралия</a></li> </ul> </li> </ul> </body>
