标签宽度由内容或子标签撑开
- display:flex
// 例:使 li 的宽度由字标签span的宽度撑开,给 ul 设置flex布局。
html:
<ul className="list">
<li className="item">
<span className="text">哈哈</span>
<span className="text">哈哈</span>
<span className="text">哈哈</span>
</li>
<li className="item">
<span className="text">哈哈</span>
<span className="text">哈哈</span>
<span className="text">哈哈</span>
</li>
<li className="item">
<span className="text">哈哈</span>
<span className="text">哈哈</span>
<span className="text">哈哈</span>
</li>
</ul>
css:
.list{
display:flex;
flex-direction:column;
align-items:flex-start; // 关键属性
}