xxxxxxxxxx<html><head><meta charset="utf-8"> <title>W3Cschool教程(w3cschool.cn)</title> <style> ul { float:left; width:100%; padding:0; margin:0; list-style-type:none; } a { float:left; width:6em; text-decoration:none; color:white; background-color:purple; padding:0.2em 0.6em; border-right:1px solid white; } a:hover {background-color:#ff3300;} li {display:inline;}</style></head><body> <ul> <li><a href="#">链接一</a></li> <li><a href="#">链接二</a></li> <li><a href="#">链接三</a></li> <li><a href="#">链接四</a></li> </ul> <p> 上面的示例中,我们让ul元素和元素浮动。 li元素将显示为内联元素(没有换行符的元素之前或之后)。这迫使列表为一行。 ul元素的宽度的100%,每一个超链接列表的宽度6 em(当前字体大小的6倍)。 我们添加一些颜色和边界使其更高档。</p></body></html>