如何將 SVG 徽標放置在 PNG 影像頂部的中心？
這是我的圖片：
這就是我需要的。
這是我的 SVG 檔案：它是最底部的，白色的。 svg
任何幫助表示贊賞。我必須在頂部制作很多帶有不同徽標的橫幅。
uj5u.com熱心網友回復：
這是一個簡單的例子，如何使用 HTML/CSS 將兩個影像放在彼此的頂部。注意使用background-position-y屬性從組合精靈中選擇白色標志。
顯示代碼片段
.outer-img {
display: flex;
justify-content: center;
align-items: center;
width: 413px; /* keep ratio */
height: 66px; /* keep ratio */
background-image: url('https://i.stack.imgur.com/GWrGs.png');
background-size: 100%;
}
.inner-img {
flex: 0 0 auto;
width: 40px; /* this depends on inner shape */
height: 40px;
background-image: url('https://svgshare.com/i/bBX.svg');
background-size: 40px 160px; /* keep ratio of SVG canvas */
background-position: 0 -120px; /* display white variant */
}<div class="outer-img"><div class="inner-img"></div></div>如果您需要制作單個媒體專案，請查看此問題。
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/323285.html
標籤：html svg bootstrap-4
下一篇：無法在SVG中使文本加粗