大家好，我正在使用從 shapedivider 生成的 svg 整形器，你可以看到，有一條白線，我不知道為什么它在那里以及如何洗掉它。請你幫助我好嗎？
有形狀分隔符的代碼：
.custom-shape-divider-bottom-1640714253 {
width: 100%;
overflow: hidden;
line-height: 0;
transform: rotate(180deg);
}
.custom-shape-divider-bottom-1640714253 svg {
position: relative;
display: block;
width: calc(100% 1.3px);
height: 115px;
}
.custom-shape-divider-bottom-1640714253 .shape-fill {
fill: #FF2E63;
}<div class="custom-shape-divider-bottom-1640714253" id="shape">
<svg data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 120" preserveAspectRatio="none">
<path d="M1200 120L0 16.48 0 0 1200 0 1200 120z" class="shape-fill"></path>
</svg>
</div>uj5u.com熱心網友回復：
這里有四個例子。前兩個使用 SVG 作為背景或位于<div>. 它們都有一個白色三角形來切斷背景顏色。這將留下堅實的背景。
第三個例子是使用 CSS clip-path 來切斷底部的三角形。在這個例子中，三角形的高度有點難以計算。但一個優點是三角形是透明的。
第四個例子看起來很像你的。在這個例子中，我在 y 軸上平移了<path>-1 單位，因此 SVG 的上邊界不是“抗鋸齒”。
.photocollage {
height: 200px;
background: #FF2E63 url('data:image/svg xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMjAwIDEyMCI PHBhdGggZD0iTSAwIDAgTCAxMjAwIDEyMCBMIDAgMTIwIFoiIGZpbGw9IiNGRkYiLz48L3N2Zz4=');
background-repeat: no-repeat;
background-position: center bottom;
background-size: 101% auto;
}
.photocollage2 {
background: #FF2E63;
position: relative;
}
.photocollage2 svg {
position: absolute;
bottom: 0;
}
.photocollage3 {
height: 200px;
background: #FF2E63;
clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 80px));
}
.photocollage4 {
height: 160px;
background: #FF2E63;
}<p>Example 1</p>
<div class="photocollage"></div>
<p>Example 2</p>
<div class="photocollage2">
<div style="height: 200px;"></div>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 120">
<path d="M 0 0 L 1200 120 L 0 120 Z" fill="#FFF"/>
</svg>
</div>
<p>Example 3</p>
<div class="photocollage3"></div>
<p>Example 4</p>
<div class="photocollage4"></div>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 120">
<path transform="translate(0 -1)" d="M 0 0 L 1200 0 L 1200 120 L 0 1 Z" fill="#FF2E63"/>
</svg>uj5u.com熱心網友回復：
嘗試給 svg 一個非常小的負邊距頂部，一個或兩個像素應該可以解決問題。它應該將形狀稍微向上拉以彌合差距。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/410802.html
標籤：
上一篇：如何在SVG中合并SVG？