Ниспадающее меню средствами CSS.

<style>
ul#cssmenu {
        width:700px;
        margin: 0;
        border: 0 none;
        padding: 0;
        list-style: none;
        background:;
        height: 30px;
        font: bold 12px/28px Verdana, Arial;
        border-left:red 1px solid;
}
 
ul#cssmenu li {
        margin: 0;
        border: 0 none;
        padding: 0;
        float: left;
        display: inline;
        list-style: none;
        position: relative;
        height: 30px;
}
 
ul#cssmenu ul {
        margin: 0;
        border: 0 none;
        padding: 0;
        width: 160px;
        list-style: none;
        display: none;
        position: absolute;
        top: 30px;
        left: 0;
}
 
 
ul#cssmenu ul:after {
        clear: both;
        display: block;
        font: 1px/0px serif;
        content: ".";
        height: 0;
        visibility: hidden;
}
 
ul#cssmenu ul li {
        width: 200px;
        float: left;
        display: block !important;
        display: inline;
}
 
/* Main Menu */
ul#cssmenu a {
        border: 0px;
        padding: 0 10px;
        float: none !important;
        float: left;
        display: block;
        background:;
        color: #000099;
        font: bold 12px/28px Verdana, Arial;
        text-decoration: none;
        height: auto !important;
        height: 1%;
}
 
/* Main Menu Hover */
ul#cssmenu a:hover,
ul#cssmenu li:hover a,
ul#cssmenu li.iehover a {
       color:#6699FF;
 
}
 
/* Second Menu */
ul#cssmenu li:hover li a,
ul#cssmenu li.iehover li a {
        border-top: 2px solid #6699FF;
        float: none;
        background: #99CCFF;
        color: #FFFFFF;
}
 
/* Second Menu Hover */
ul#cssmenu li:hover li a:hover,
ul#cssmenu li:hover li:hover a,
ul#cssmenu li.iehover li a:hover,
ul#cssmenu li.iehover li.iehover a {
        border-top: 2px solid ;
        background: #FFFFFF;
        color:#6699FF;
        border:#336600 1px solid;
}
 
ul#cssmenu ul ul {
        display: none;
        position: absolute;
        top: 0;
        left: 170px;
}
 
ul#cssmenu li:hover ul ul,
ul#cssmenu li.iehover ul ul {
        display: none;
}
 
ul#cssmenu li:hover ul,
ul#cssmenu ul li:hover ul,
ul#cssmenu li.iehover ul,
ul#cssmenu ul li.iehover ul {
        display: block;
}
</style>
<script>// JavaScript Document
function cssmenuhover()
{
        if(!document.getElementById("cssmenu"))
                return;
var lis = document.getElementById("cssmenu").getElementsByTagName("LI");
        for (var i=0;i<lis.length;i++)
        {
                lis[i].onmouseover=function()
{this.className+=" iehover";}
                lis[i].onmouseout=function()
{this.className=this.className.replace(new RegExp(" iehover\\b"), "");}
        }
}
if (window.attachEvent)
        window.attachEvent("onload", cssmenuhover);
</script>
<ul id="cssmenu">
        <li><a href="#">Горизонтальное</a>
                <ul class="ulfirst">
                        <li><a href="#">Ссылка 1</a></li>
                        <li><a href="#">Ссылка 2</a></li>
                        <li><a href="#">Ссылка 3</a></li>
                </ul>
                <ul class="ulsecondt">
                        <li><a href="#">Ссылка 4</a></li>
                        <li><a href="#">Ссылка 5</a></li>
                        <li><a href="#">Ссылка 6</a></li>
                </ul>
        </li>
        <li><a href="#">CSS</a>
                <ul>
                        <li><a href="#">Ссылка 1</a></li>
                        <li><a href="#">Ссылка 2</a></li>
                        <li><a href="#">Ссылка 3</a></li>
                        <li><a href="#">Ссылка 4</a></li>
                        <li><a href="#">Ссылка 5</a></li>
                </ul>
        </li>
        <li><a href="#">PHP</a>
                <ul>
                        <li><a href="#">Ссылка 1</a></li>
                        <li><a href="#">Ссылка 2</a></li>
                        <li><a href="#">Ссылка 3</a></li>
                        <li><a href="#">Ссылка 4</a></li>
                        <li><a href="#">Ссылка 5</a></li>
                </ul>
        </li>
        <li><a href="#">Меню</a>
                <ul>
                        <li><a href="#">Ссылка 1</a></li>
                        <li><a href="#">Ссылка 2</a></li>
                </ul>
        </li>
</ul>

<html>
<head>
<title>list</title>
<link rel="stylesheet" type="text/css" href="list_style.css" />
</head>
<body>
 
<ul id="main_nav">
            <li><a href="#">О компании</a></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><!--end sub_nav-->
            </li>
            <li><a href="#">Тарифы</a></li>
 
            <li><a href="#">Новости</a></li>
            <li><a href="#">Контакты</a></li>
        </ul><!--end main_nav-->
</body>
</html>

<html>
<head>
<title>list</title>
<style>
ul { list-style: none; margin: 0; padding: 0;}
.GL {                   float:left;
                        display: inline;
                        padding: 0 8px;
                        padding-bottom: 3px;
                        border-left: 1px dotted #8b6619;
                        position: relative;
                        text-align: left;}
 #main_nav li:first-child, #main_nav ul li {
                        border-left: none;
                        }
#main_nav ul {
                        display: none;
                        position: absolute;
                        top: 20px;
                        left: -5px;
                        width: 155px;
                        height: 80px;
                        background-color: #d7ae46;
                        }
                #main_nav li a, #main_nav li ul li a{
                        color: #8b6619;
                        font-family: "Times New Roman", serif;
                        font-size: 0.9em;
                        font-weight: bold;
                        text-decoration: none;
                        outline: none;
                        }
                #main_nav li a:hover, #main_nav li ul a:hover {
                        color: black;
                        }
#main_nav {
                        float: left;
                        top: 15px;
                        left: 270px;
                        margin-top: 14px;
                        margin-left: 280px;
                        }
 
ul ul {display:none;} // Все списки, вложенные в первый, по умолчанию скрыты
 
* Second Menu Hover */
ul#main_nav li:hover li a:hover,
ul#main_nav li:hover li:hover a,
ul#main_nav li.iehover li a:hover,
ul#main_nav li.iehover li.iehover a {
        border-top: 2px solid ;
        background: #FFFFFF;
        color:#6699FF;
        border:#336600 1px solid;
}
 
ul#main_nav ul ul {
        display: none;
        position: absolute;
        top: 0;
        left: 170px;
}
 
ul#main_nav li:hover ul ul,
ul#main_nav li.iehover ul ul {
        display: none;
}
 
ul#main_nav li:hover ul,
ul#main_nav ul li:hover ul,
ul#main_nav li.iehover ul,
ul#main_nav ul li.iehover ul {
        display: block;
}
 
</style>
 
<script>// JavaScript Document
function main_navhover()
{
        if(!document.getElementById("main_nav"))
                return;
var lis = document.getElementById("main_nav").getElementsByTagName("LI");
        for (var i=0;i<lis.length;i++)
        {
                lis[i].onmouseover=function()
{this.className+=" iehover";}
                lis[i].onmouseout=function()
{this.className=this.className.replace(new RegExp(" iehover\\b"), "");}
        }
}
if (window.attachEvent)
        window.attachEvent("onload", main_navhover);
</script>
 
</head>
<body>
 
<ul id="main_nav">
                        <li class="GL"><a href="#">О компании</a></li>
                        <li class="GL"><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><!--end sub_nav-->
                        </li>
                        <li class="GL"><a href="#">Тарифы</a></li>
 
                        <li class="GL"><a href="#">Новости</a></li>
                        <li class="GL"><a href="#">Контакты</a></li>
                </ul><!--end main_nav-->
</body>
</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>list</title>
    <link rel="stylesheet" type="text/css" href="list_style.css" />
</head>
<body>
 
<ul id="navigation">
    <li><a href="#">О компании</a></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><!--end sub_nav-->
    </li>
    <li><a href="#">Тарифы</a></li>
    <li><a href="#">Новости</a></li>
    <li><a href="#">Контакты</a></li>
</ul><!--end main_nav-->
</body>
</html>