定义无序列表的CSS样式——XHTML+CSS导航条
如何用XHTML和CSS制作一款导航条呢？希望我总结的这些资料可以帮助你回答这个问题。
实际效果
- Read emails
- Write book
- Go shopping
- Cook dinner
- Watch Scrubs
使用代码：
使用本代码，你需要一张修饰列表的小图片。
HTML：
<ul>
<li>Read emails</li>
<li>Write book</li>
<li>Go shopping</li>
<li>Cook dinner</li>
<li>Watch Scrubs</li>
</ul>
CSS：
li的padding值根据图片的大小设置，以文字不覆盖图片为准。
body {
font-family: "Myriad Pro", Frutiger, "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", Verdana, sans-serif;
font-size: 1.4em;
}
ul { margin: 0; padding: 0; list-style-type: none;}
li { background: url(images/bullet.gif) no-repeat 0 50%; padding-left: 30px;}