Html svg和其他元素之间的白线
我有一个非常简单的svg,只有一种颜色和三个多边形点 在某些宽度的Chrome中,svg前面有一条白线,不应出现: 顶部有一个颜色相同的div。svg甚至与具有相同颜色的div重叠Html svg和其他元素之间的白线,html,css,google-chrome,svg,Html,Css,Google Chrome,Svg,我有一个非常简单的svg,只有一种颜色和三个多边形点 在某些宽度的Chrome中,svg前面有一条白线,不应出现: 顶部有一个颜色相同的div。svg甚至与具有相同颜色的div重叠margin bottom-10px但该白线始终出现: <?xml version="1.0" encoding="utf-8"?> <!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Bu
margin bottom-10px代码>但该白线始终出现:
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 21.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Ebene_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 1920 145" style="enable-background:new 0 0 1920 145;" xml:space="preserve">
<style type="text/css">
.st0{fill:#262120;}
</style>
<g>
<polygon class="st0" points="1920,145 0,0 1920,0 "/>
</g>
</svg>
.st0{fill:#262120;}
这里有什么问题?这可能是因为所有html元素在css中都设置了正常的行高
line-height: 0;
可能会解决此问题不确定是否为笔划,但可以尝试添加笔划:#262120;对于你的css类来说,这听起来可能类似于图像有时会有像素间隙。如果您给svg一种垂直对齐的样式:top?可能是抗锯齿?它也可能是通过缩小svg而产生的抗锯齿。所有经典技巧似乎都不起作用:(我想这是一个抗锯齿问题。特别是因为它只发生在特定的视口宽度上。