很多网页的导航栏都会有小三角。其实实现这个功能还是挺简单的。以菜鸟教程的首页导航为例。先写一个大的div_nav，将“主页”、“菜鸟笔记”、“菜鸟工具”、“参考手册”等作为div包含在div_nav中。div_nav背景颜色设置为相应的颜色。背景色设置代码如下：.blue#slatenavullia:hover,.blue#slatenavullia.current{color:#fff;background:transparenturl(images/blueslate_backgroundOVER.gif)no-repeattopcenter;}即：.blue#slatenavullia:hover,.blue#slatenavullia.current上面代码的注解是：id是菜单中ul的li。也就是说，导航栏中的每个元素。鼠标放在上面后效果就出来了。后面加一个ul，表示弹出的是一个ul元素。里面的css就是指定这个ul元素里面的样式。说白了就是鼠标悬停在导航栏上的效果。比如我们在HTML中为一个label元素的鼠标悬停状态设置字体颜色：a:hover{color:red;}a:hover表示鼠标悬停a:current应该表示获得焦点。小三角形也很好设置。蓝色#slatenav{position:relative;display:block;height:42px;font-size:11px;font-weight:bold;background:transparenturl(images/blueslate_background.gif)repeat-xtopleft;font-family:Arial,Verdana,Helvitica,sans-serif;text-transform:uppercase;}通过background设置“主页”等小div的背景图片。上面设置了鼠标滑过标签的效果，所以当鼠标滑到其他标签时，小三角形的背景也会显示出来。当鼠标滑过其他标签时：OK，这样一个带有小三角的导航就做好了，至于其他的细节，大家可以自己慢慢调整。注意：文档的命名空间是在代码中声明的。单独写标签并没有声明文档的命名空间，而是加上xmlns="http://www.w3.org/1999/xhtml"就声明了文档的命名空间。声明命名空间，浏览器在解析HTML文档的标签时将遵循此规范。在一般使用中，你不会感觉到两者有太大区别。特殊情况在于对一些标签的解释，比如xhtml的命名约定，要求标签必须严格闭合，单个标签末尾要加“/”。如果使用xhtml的命名约定，没有按照规范，可能会出现无法解析标签的情况。因此，一个好的写作习惯是建议添加结束标签。附上源码：
