服务器之家
您的位置： 首页 编程语言 css

HTML+CSS div实现空行，padding起作用，margin不起作用

100人浏览   2024-09-11 08:03:42

今天在开发一个web应用时，需要在页面上增加一个空行，但我又不希望增加多余的代码，比如使用 来增加内容，也不希望使用<br />这样多余的html无素，因此我直接使用了
<div>上面增加样式来控制显示的效果。

<style>

.p_5 {padding:5px}

.m_5 {margin:5px}

</style>

<div>A1</div>

<div class="p_5"></div>

<div class="m_5 "></div>

<div class="ta_c m_10 fs_14”>sss</div>

对于margin外边距，如果DIV里面没有东西，则外边距，也不会起作用

对于padding内边距，如果DIV里面没有东西，则外边距，也会起作用（增加了边柜），在页面上显示出来


对于这种情况，估计原因是：

用padding时，因为对于这个div的box，增加了内边距，使即使div里没有无素也占用空间

而用margin时，因为对于这个div的box，增加外边距，但这个div本身就没有元素，因此它无法增加，应该可以这样理解。

相关推荐