HTML CSS LI 包装
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/297251/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
HTML CSS LI Wrapping
提问by Craig
I have a vertical menu in my system which is basically made of HTML ul/liwith CSS styling (see image below). However I don't want the liitems which are wider than the menu to wrap, I would prefer them to overflow with a horizontal scroll bar at the bottom of the menu. How can I do this in CSS?
我的系统中有一个垂直菜单，它基本上由 HTML ul/ liCSS 样式组成（见下图）。但是我不希望li比菜单更宽的项目被包裹，我希望它们在菜单底部用水平滚动条溢出。我怎样才能在 CSS 中做到这一点？
回答by Owen
ul {
overflow: auto; // allow li's to overflow w/ scroll bar
// at the bottom of the menu
}
li {
white-space: nowrap; // stop the wrapping in the first place
}
回答by sblundy
Use white-space:nowrap. Like so:
使用white-space:nowrap. 像这样：
li {
white-space:nowrap;
}
Here's some documentation.
这是一些文档。
回答by slashnick
You would also need to give the style the ul:
您还需要为样式指定 ul：
ul{
width:250px;
overflow:auto;
}
