Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/73.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/36.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
HTML按钮元素-内部svg图像-奇怪的间隙&；定位_Html_Css_Button_Svg_Css Position - Fatal编程技术网
Fatal编程技术网
  • html/
  • HTML按钮元素-内部svg图像-奇怪的间隙&；定位

HTML按钮元素-内部svg图像-奇怪的间隙&；定位

html css button svg

HTML按钮元素-内部svg图像-奇怪的间隙&；定位,html,css,button,svg,css-position,Html,Css,Button,Svg,Css Position,我有以下HTML： <button class="button"> <img src="img/menu-2.svg"> </button> 当我用Firebug检查按钮时，我可以看到在图像和按钮边框之间仍然存在某种奇怪的间隙。是否仍有删除此项的方法？我希望图像尽可能地填充按钮，或者至少居中 以下是一个屏幕截图： 或者它与SVG文件有关？这是应该影响定位的SVG代码： x="0px" y="0px" width="44px" height="44px"

我有以下HTML：

<button class="button">
  <img src="img/menu-2.svg">
</button>
当我用Firebug检查按钮时，我可以看到在图像和按钮边框之间仍然存在某种奇怪的间隙。是否仍有删除此项的方法？我希望图像尽可能地填充按钮，或者至少居中

以下是一个屏幕截图：

或者它与SVG文件有关？这是应该影响定位的SVG代码：

x="0px" y="0px" width="44px" height="44px" viewBox="0 0 44 44" enable-background="new 0 0 16 16"
让我印象深刻的是
启用背景
，但我不知道它做了什么&删除它什么也没做。

保存svg时，您需要确保您的作品包含整个画布板，以便最终图像中没有空白

根据上面的图片，在顶部、左侧和底部会有额外的间距，这会导致一些不合适的间距

上图显示了保存svg的正确方法，以及在将图像用于web时防止不必要的间距

我很高兴我能帮上忙，祝你的设计伙伴好运

你有SVG图像在线吗？@OlafDietsche当然，它是Adam Whitcroft的“批处理”图标集中的菜单图标。我将其粘贴到一个提琴中：（注意我在调试时如何将48px更改为48px）。当您保存svg文件时，是在画布上保存了空白还是画布大小仅包含图标而没有其他内容？使用chrome@Sven平心而论，该类是在HTML
按钮中还是在
菜单按钮中？

x="0px" y="0px" width="44px" height="44px" viewBox="0 0 44 44" enable-background="new 0 0 16 16"