Html 段落间距

有人能问我如何得到示例中显示的间距吗？我尝试了多种方法，如，但它有额外的空白，我不希望

例如

My interest
     Hi I am Bob. I work somewhere here, I do things I like, I love pet, I like cat
     and I love sports

            

---

css中有两种主要的间距方法，

padding

和

margin

填充

在应用此属性的元素内添加空格。假设您有一个元素

，左边有

填充：12px，因此该元素的内容左侧将有12px的间隙。有时，在使用
padding
与explict
width
结合使用时，您必须小心。例如，如果一个元素的宽度是200px，并且您添加了
padding:20px（因此顶部、右侧、底部和左侧为20px）元素的新宽度将为240px，而不是200px。为了防止这种“增长”，您可以添加
框大小：边框框到您的元素

margin
在元素之间添加一个空格。假设有to
元素具有
display:block
（因此它们显示在彼此下方）。他们也有属性
margintop:20px，因此它们在其相邻元素的顶部有一个20px的余量

下面是一个带有一些间距方法的代码示例。请注意元素之间的差异
。正如我所说的，
padding
是框内的间隙，而
margin
是框外的间隙


。示例1{
显示：块；
位置：相对位置；
背景：#dedede；
宽度：300px；
/*在容器中添加一些填充物*/
填充：4px 12px；/*上下和左右填充*/
框大小：边框框；/*Div的宽度应保持在300px*/
/*下一个例子的页边空白*/
边缘底部：32px；
}
.example-1>.title{
显示：块；
位置：相对位置；
字号：28px；
字体大小：粗体；
背景：rgba（255,0,0,0.2）；
}
.example-1>.description{
显示：块；
位置：相对位置；
字体大小：16px；
左侧填充：24px；
背景：rgba（0255,0,0.2）；
文本对齐：对齐；
}
.示例2{
显示：块；
位置：相对位置；
背景：#dedede；
宽度：300px；
/*在容器中添加一些填充物*/
填充：4px 12px；/*上下和左右填充*/
框大小：边框框；/*Div的宽度应保持在300px*/
}
.example-2>.title{
显示：块；
位置：相对位置；
字号：28px；
字体大小：粗体；
背景：rgba（255,0,0,0.2）；
}
.example-2>.description{
显示：块；
位置：相对位置；
字体大小：16px；
左边距：24px；
背景：rgba（0255,0,0.2）；
文本对齐：对齐；
}

带填充的示例
我的名字叫Lorem ipsum dolor sit amet，我的名字叫consetetur sadipscing Eliter，我的名字叫diam Nonum eirmod Temporal
在劳动和就业方面，我们需要更多的资金。在vero eos等
这是一个很好的例子。斯特特·克里塔·卡斯德·古伯格伦，没有大海
圣殿是圣殿。
带边距的示例
我的名字叫Lorem ipsum dolor sit amet，我的名字叫consetetur sadipscing Eliter，我的名字叫diam Nonum eirmod Temporal
在劳动和就业方面，我们需要更多的资金。在vero eos等
这是一个很好的例子。斯特特·克里塔·卡斯德·古伯格伦，没有大海
圣殿是圣殿。
Hi。欢迎来到堆栈溢出。请张贴你迄今为止所做的事情。如果您需要帮助，请使用以下指南@Michaet有没有办法扩展该区块？它似乎压缩了区块内的所有文本哪个区块？灰色的那个？您只需更改
宽度：300px行到另一个大小。例如，
100%
将该元素融入父元素。我已经解决了，谢谢！您知道如何删除文本上方的空白吗？