Html SVG附加页边距

Html SVG附加页边距,html,css,svg,Html,Css,Svg,有人能给我解释一下为什么在第一个分区和第二个分区之间有额外的3倍空间: 如果你把高度:40px在第一个div中,但我不明白为什么有必要这样做。这在Chrome、FireFox和IE中普遍存在。SVG是一个内联元素,内联元素的默认垂直对齐是基线 svg { vertical-align: middle; /* or anything other than baseline */ } SVG是一个内联元素,内联元素的默认垂直对齐是基线 svg { vertical-align

有人能给我解释一下为什么在第一个分区和第二个分区之间有额外的3倍空间:



如果你把
高度:40px在第一个div中,但我不明白为什么有必要这样做。这在Chrome、FireFox和IE中普遍存在。

SVG是一个内联元素,内联元素的默认垂直对齐是基线

svg {
    vertical-align: middle; /* or anything other than baseline */
}

SVG是一个内联元素,内联元素的默认垂直对齐是基线

svg {
    vertical-align: middle; /* or anything other than baseline */
}

奇怪,谢谢。如果按照您的建议做,而不仅仅是将其作为
元素(除了显而易见的,假设我只计划在我的页面上有一个SVG元素)会有什么好处?嗯,为什么
span
没有这个问题(或任何其他内联元素)?啊,我看到
textarea
展示了同样的问题。。。mozilla文档中的引述部分替换元素的基线,如HTML规范中未指定的元素,这意味着它们使用此关键字的行为可能会从一个浏览器更改到另一个浏览器。如果您只有1个,则任何一种方式都可以。更改显示属性将改变您可以在元素上使用的其他样式(例如,内联元素的居中是通过文本对齐完成的,而块元素的居中是通过边距完成的)。奇怪,谢谢。如果按照您的建议做,而不仅仅是将其作为
元素(除了显而易见的,假设我只计划在我的页面上有一个SVG元素)会有什么好处?嗯,为什么
span
没有这个问题(或任何其他内联元素)?啊,我看到
textarea
展示了同样的问题。。。mozilla文档中的引述部分替换元素的基线,如HTML规范中未指定的元素,这意味着它们使用此关键字的行为可能会从一个浏览器更改到另一个浏览器。如果您只有1个,则任何一种方式都可以。更改“显示”特性将改变可以在元素上使用的其他样式(例如,内联元素的居中是通过文本对齐完成的,而块元素的居中是通过边距完成的)。