只要消除<ul>元素的内边距的上边距即可，例如
ul{ padding:0 20px} /*设置ul元素上下内边距为0，左右内边距20px*/示例如下：
创建Html元素
<ul><li>itemlist 1</li>
<li>itemlist 2</li>
<li>itemlist 3</li>
</ul
设置css样式
ul{width:100pxpadding:0 20pxborder:4px solid #bebceb观察显示效果
边框在css里用border的属性表示，边框有4个上下左右，也可以单独用border-top，border-right，border-bottom，border-left单独表示4个边框及border-top-width,border-top-style,border-top-color来表示宽度,样式以及颜色。例如：#divcss5{border:1px solid #00F} //设置了divcss5对象盒子1px像素蓝色实线边框
1）、边框颜色：border-color:#000
2）、边框厚度（宽度）：border-width:1px
3）、边框样式：border-style:solid
上边框的设置：border-top:1px solid #00F
1）、上边框颜色：border-top-color:#000
2）、上边框厚度（宽度）：border-top-width:1px
3）、上边框样式：border-top-style:solid
给文字加一个<b>标签,然后设置<b>标签的样式就可以了,如果换成<p>标签,显示会出一点小问题代码如下:
---------------------------------------------------------------------------------
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=utf8" />
<style type="text/css">
body {font-size:12px}
a {color:#000text-decoration:none}
a:hover {color:#F00}/*主菜单伪类*/
#menu {width:100pxborder:1px solid #ccc}
#menu ul {list-style:nonemargin:0pxpadding:0px}
#menu ul li {background:#eeepadding: 0pxheight:26pxline-height:26px/*字体在上下边框的剧中位置*/ border-bottom:1px solid #cccposition:relative}
#menu ul li ul {display:none/*隐藏此UL*/ position:absoluteleft:100pxtop:0pxwidth:100pxborder:1px solid #cccborder-bottom:none}
#menu ul li:hover ul {display:block}/*ul li下的ul显示*/
/*修改了这里*****************************************/
#menu ul li ul b{ color: #FF0000}
/*修改了这里*****************************************/
</style>
</head>
<body>
<div id="menu">
<ul>
<li><a href="@#">首页</a>
<li><a href="#">网页版式布局</a>
<ul>
<li><a href="#"><b >自适应宽度</b></a></li>
<li><a href="#">固定宽度</a></li>
</ul>
</li>
<li><a href="#">div+css教程</a>
<ul>
<li><a href="#">新手入门</a></li>
<li><a href="#">视频教程</a></li>
<li><a href="#">常见问题</a></li>
</ul>
</li>
<li><a href="#">div+css实例</a></li>
<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>
<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>
</div>
</body>
</html>
