我正在尝试在标题的每一行之间添加间距。有些字母似乎重叠,而另一些则非常靠近下一行。我尝试添加padding
,但这是在整个文本周围添加填充,而不是每行。任何帮助都将不胜感激。
JSFiddle演示
您可能正在寻找line-height
css动词:
line-height: 1.6em;
https://jsfiddle.net/L1jch0Lf/3/
请参阅MDN上的文档。
您可以使用无序列表来完成类似的操作。我强烈建议不要使用常规文本,因为我相信它背后会有一些真实的元素
#box {
width: 500px;
border: 1px solid #000;
}
ul {
list-style: NONE;
padding: 0;
margin: 0;
}
<div id="box">
<ul>
<li><p>Lorem ipsum dolor sit amet, consectetur adipiscing 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.</p></li>
<li>Text</li>
<li>Text</li>
<li>Text</li>
<li><p>Lorem ipsum dolor sit amet, consectetur adipiscing 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.</p></li>
<li>Text</li>
</ul>
</div>
line-height:150%;
大多数浏览器中的默认行高约为110%至120%
或
line-height: 30px;
或
line-height:1.5;