我有一个div元素应该是一个水平主菜单。我使用ul及其li作为菜单项。 li是inline-block，因此他们会制作横向菜单。我将div的宽度设置为100％，但我没有为div设置任何高度，因此其高度由其填充，边框和内容定义。现在我想把它的高度固定到它的高度（没有直接定义），所以我可以使用overflow在较小的屏幕尺寸上隐藏溢出的菜单项。我认为这对响应式设计会有好处。它可以用纯CSS完成吗？
目前，当我使浏览器的宽度变小时，菜单项会堆积起来，生成超过1行的菜单项并强制div的高度适合。我想只看到第一行菜单项。
答案 0 :(得分：1)
您可以使用css
确保div的内容保持在一行white-space: nowrap;
如果你想要多行，你可以做类似
的事情max-height: 3em; (or whatever value is appropriate)
请注意溢出的内容在从元素中溢出时的外观，它可能突然剪切出视图并且看起来有点讨厌。如果它只是文本，你可以使用
text-overflow: ellipsis;
但如果你正在处理实际的元素，那就更复杂了！仅使用css和伪元素就可以创建漂亮的淡入淡出，这就是我要做的事情。