Html 在这种情况下，为什么边距底部似乎只在Firefox中起作用？_Html_Css

Html 在这种情况下，为什么边距底部似乎只在Firefox中起作用？

html css

Html 在这种情况下，为什么边距底部似乎只在Firefox中起作用？,html,css,Html,Css,我正在为一个当地社区中心开发网站，我遇到了一个奇怪的CSS问题。当我使用margin-bottom属性在两个元素之间留出一些空间时，它似乎只在Firefox中起作用。我可以使用br标签进行变通，但我想知道出了什么问题。下面是我用同样的问题测试的代码示例 <!DOCTYPE html> <html> <header><title>Example</title></header> <body> <p>Th

我正在为一个当地社区中心开发网站，我遇到了一个奇怪的CSS问题。当我使用margin-bottom属性在两个元素之间留出一些空间时，它似乎只在Firefox中起作用。我可以使用br标签进行变通，但我想知道出了什么问题。下面是我用同样的问题测试的代码示例

<!DOCTYPE html>
<html>
<header><title>Example</title></header>
<body>
<p>This is some text.</p>
<br style="margin-bottom:300px;" />
<p>This is some other text.</p>
</body>
</html>


例子
这是一些文本


这是另一个文本

当我在Firefox中看到第一段和第二段之间有300像素的间距。当我在IE、Chrome和Safari中查看它时，只有p和br标签会产生的常规间隙。我做错了什么

为了澄清，我发现这种情况发生在br、img和p上，所以改变样式并没有多大帮助。同样的问题，如果我把它放在第一个p标签上，然后把br一起拿出来。我第一次注意到问题的地方是，它发生在一个图像和一个p标签之间

对不起，如果以前有人问过/回答过这个问题。搜索中出现了许多类似的问题，但没有一个答案解决了我的问题。

将其更改为div:

<div style="margin-bottom:300px;"></div>

与上面的注释一样，

br

标记是特殊的，通常不设置样式

img

标签是

inline块

元素，

标签是

inline

我相信

通常，如果某个元素显示为内联元素，并且我想对其应用样式，我会使用

display:block:

，例如with

span

是一种特殊类型的元素，通常不会对其进行样式设置（尽管如您所见，一些浏览器会尊重它）。相反，您可能希望在

上添加您的边距。看看这个问题。