HTML代码：

外面一个大DIV，里面分为图片和导航文字两部分。图片用一个DIV，文字用无序列表。

CSS样式代码：

导航栏整体DIV，先设置宽和高，margin:0 auto;使导航栏整体居中。

line-height和height值设为相同使ul中的文字居中。

包含图片的DIV设置左浮动， 设置图片大小 。

ul中清除样式，去掉•  右浮动使列表靠右

li即文字，设置左浮动 

ul是li的父元素，li中设置了左浮动，所以ul中要清除浮动

清除链接文字的下划线

当鼠标放在导航栏的文字上，鼠标出现手的形状

ps：CSS样式中，带有层级的样式优先级大于不写层级的样式。带有层级的样式会覆盖不带层级的样式。