问：
怎么写横向导航用css
答：
横向导航可以使用CSS中的float属性来实现。具体可以这么写:
nav.navbar {
overflow: hidden; /清除浮动/
}
nav.navbar ul {
list-style: none; /去除默认的列表样式/
padding: 0; /去除默认的内边距/
}
nav.navbar li {
float: left; /设置元素浮动,使其排列在一行/
}
nav.navbar a {
display: block; /使链接占满整个li区域,以至于鼠标放上去是整个区域都是链接/
padding: 1em; /给链接添加内边距/
background: #eee; /给链接添加背景色/
text-decoration: none; /去除下划线/
color: #333; /设置文字颜色/
}
nav.navbar a:hover {
background: #fff; /鼠标悬浮时的背景色/
}
要点总结:
1. 设置overflow: hidden清除浮动。
2. 设置ul和li的样式,去除默认样式。
3. 设置li元素浮动,使其在一行显示。
4. 设置a元素为块级元素,并添加必要的内外边距、颜色、背景等样式。
5. 设置a:hover选择器,添加鼠标悬浮效果。
以上是横向导航的基本css代码,你可以根据需要添加更多属性,如阴影、圆角、动画等来美化导航。也可以根据active选择器设置当前页面的链接样式。总之,掌握浮动和链接样式设定是实现横向导航的两大要素。