需要有关 float DIV 和列表的帮助。 DIV float 到页面的右侧，而列表条目则围绕其流动。问题在于，将背景颜色应用于列表的 LI 元素时，颜色会拉伸(stretch)全宽度，而文本在到达 DIV 时会换行。如何使 LI 的背景颜色像文本一样换行，同时保持 LI 的显示为 block ？
这里是示例代码:
<html>
<style>
.mydiv {
height: 200px;
width: 200px;
background-color: red;
margin-right: 45px;
float: right;
clear: right;
}
li {
background-color: cyan;
}
</style>
<body>
<div class="mydiv"></div>
<ul>
<li>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure
dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</li>
</ul>
</body>
</html>最佳答案
尝试 display: inline; 如下
li
{
background-color:cyan;
display: inline;
}
编辑:
另一种方式，假设您可以在 UL 中添加固定的
ul
{
width: 700px;
}
关于css - UL 和 float DIV : list text wraps but background color doesn't，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10047910/