目前,svg 的宽度和高度为 48px,路径为 40px。如何使它们的大小相等?
* {
margin: 0;
padding: 0;
}
.container {
width: 48px;
height: 48px;
border: 1px solid red;
}
.container svg {
display: block;
height: 100%;
width: 100%;
}
<div class="container">
<svg viewBox="0 0 24 24" fill="black" width="1em" height="1em">
<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 14.5v-9l6 4.5-6 4.5z"></path>
</svg>
</div>
更改元素中的viewBox
属性svg
* {
margin: 0;
padding: 0;
}
.container {
width: 48px;
height: 48px;
border: 1px solid red;
}
.container svg {
display: block;
height: 100%;
width: 100%;
}
<div class="container">
<svg viewBox="2 2 20 20" fill="black" width="1em" height="1em">
<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 14.5v-9l6 4.5-6 4.5z"></path>
</svg>
</div>
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句