我正在使用< ul>创建此标题菜单我想将它拉伸到页面的所有顶部.我首先使用宽度:100%但它没有用.然后我在某个地方看到了一个类似的例子,它使用了溢出:隐藏所以当我使用它时它将列表拉伸到最后.我想知道溢出做了什么这里和为什么宽度:100%不能做类似的动作?
ul { list-style-type: none; padding: 0; margin: 0; overflow: hidden; background-color: black; } li { background-color: black; color: red; float: left; } li a{ display: inline-block; color: white; text-decoration:none; padding: 20px; text-align: center; } li a:hover{ background-color:red; }
<!DOCTYPE html> <html lang="fa"> <head> <link rel="stylesheet" type="text/css" href="menu.css"> </head> <body> <ul> <li><a target="_blank" href="http://www.google.com">Google</a></li> <li><a target="_blank" href="http://www.yahoo.com">Yahoo!</a></li> <li><a target="_blank" href="http://www.Amazon.com">Amazon</a></li> </ul> </body> </html>