Html 在 div 前后添加换行符的最佳方法是什么？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14535753/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
what's the best way to add a line break before and after div?
提问by user1285419
Someone shows me a html to use div tag to show some text with background image included
有人向我展示了一个 html 以使用 div 标签来显示一些包含背景图像的文本
<div class='main'>
<div class='img1'>
SOME TITLE TEXT
</div>
</div>";
<div class='img2'>"
SOME DESCRIPTION TEXT HERE
</div>"
Here the class img1 and img2 include two background images and the corresponding div for img2 will be shown next to img1 (without gap). I need to repeat the whole pattern couple times to show something with different content but same format.
这里 img1 和 img2 类包含两个背景图像，img2 的相应 div 将显示在 img1 旁边（没有间隙）。我需要重复整个模式几次以显示内容不同但格式相同的内容。
<!-- GROUP 1 -->
<div class='main'>
<div class='img1'>
SOME TITLE TEXT 1
</div>
</div>";
<div class='img2'>"
SOME DESCRIPTION TEXT HERE 1
</div>"
<!-- GROUP 2 -->
<div class='main'>
<div class='img1'>
SOME TITLE TEXT 2
</div>
</div>";
<div class='img2'>"
SOME DESCRIPTION TEXT HERE 2
</div>"
But I found that there is no separation between any two groups as shown above. Frankly, I really have no experience in html, I just copy the code from someone else. But after searching online, I find the
command, I try to add that tag in between the groups but it seems that the break is too much than I expect. Is there any other way to insert separation with smaller gap?
但我发现任何两组之间都没有分离，如上所示。坦白说，我真的没有html的经验，我只是从别人那里复制代码。但是在网上搜索后，我找到了
命令，我尝试在组之间添加该标签，但似乎中断比我预期的要多。有没有其他方法可以插入间隙较小的分离？
回答by dev02
You can give marginfrom topand bottomlike this:
你可以给margin从top与bottom这样的：
margin: 10px 0;
Above will apply 10pxmargin from top and bottom. You can also use individual properties such as margin-topand margin-bottom.
以上10px将从顶部和底部应用边距。您还可以使用单个属性，例如margin-top和margin-bottom。
回答by Chris DaMour
one way is to use css to style your elements.
一种方法是使用 css 来设置元素的样式。
<style>
.main
{
margin-bottom: 10px;
}
</style>
you can alter as needed..not sure what div's you want to seperate
您可以根据需要进行更改..不确定您要分离什么 div
回答by Huey
There are 2 main ways to add line breaks: through line break <br>tags and through paragraph tags <p>. So all you have to do is to put those tags in between your tags.
添加换行符有两种主要方式：通过换行<br>标记和通过段落标记<p>。所以你所要做的就是把这些标签放在你的标签之间。
回答by Nikhil Kulkarni
Add the child divs to span like below
将子 div 添加到跨度，如下所示
<div class="class1" >
<span class="span1">
data1
<br>
<span class="span2">
data2
</span>
</span>
</div>
css:
css：
.span1{
display:inline-block;
}
.span2{
display:inline-block;
}
</div>
