如何在不更改 svg 大小的情況下修剪 svg 周圍的額外空間：
<svg fill="#807c8c" width="45" height="45" version="1.1" viewBox="0 0 700 700" xmlns="http://www.w3.org/2000/svg">
<path style="stroke:#ffffff;stroke-width:5px;" d="m175 210c-3.0938 0-6.0625-1.2266-8.25-3.4141-2.1914-2.1875-3.418-5.1562-3.418-8.2539v-23.332c0.027344-21.652 8.6406-42.41 23.949-57.719s36.066-23.922 57.719-23.949h23.332c6.4453 0 11.668 5.2266 11.668 11.668s-5.2227 11.668-11.668 11.668h-23.332c-15.465 0.015625-30.293 6.1641-41.23 17.102s-17.086 25.766-17.102 41.23v23.332c0 3.0977-1.2266 6.0664-3.418 8.2539-2.1875 2.1875-5.1562 3.4141-8.25 3.4141zm361.67 175v-23.332c0-6.4453-5.2266-11.668-11.668-11.668s-11.668 5.2227-11.668 11.668v23.332c-0.015625 15.465-6.1641 30.293-17.102 41.23s-25.766 17.086-41.23 17.102h-23.332c-6.4453 0-11.668 5.2266-11.668 11.668s5.2227 11.668 11.668 11.668h23.332c21.652-0.027344 42.41-8.6406 57.719-23.949s23.922-36.066 23.949-57.719zm-256.67 70c0-3.0938-1.2266-6.0625-3.4141-8.25-2.1875-2.1914-5.1562-3.418-8.2539-3.418h-23.332c-15.465-0.015625-30.293-6.1641-41.23-17.102s-17.086-25.766-17.102-41.23v-23.332c0-6.4453-5.2266-11.668-11.668-11.668s-11.668 5.2227-11.668 11.668v23.332c0.027344 21.652 8.6406 42.41 23.949 57.719s36.066 23.922 57.719 23.949h23.332c3.0977 0 6.0664-1.2266 8.2539-3.418 2.1875-2.1875 3.4141-5.1562 3.4141-8.25zm256.67-256.67v-23.332c-0.027344-21.652-8.6406-42.41-23.949-57.719s-36.066-23.922-57.719-23.949h-23.332c-6.4453 0-11.668 5.2266-11.668 11.668s5.2227 11.668 11.668 11.668h23.332c15.465 0.015625 30.293 6.1641 41.23 17.102s17.086 25.766 17.102 41.23v23.332c0 6.4453 5.2266 11.668 11.668 11.668s11.668-5.2227 11.668-11.668z"/>
</svg>我已經為 viewBox 嘗試了一百萬個值，但似乎我無法找出邏輯......
uj5u.com熱心網友回復：
我認為您正在尋找這樣的東西，其中 SVG 會在不使藝術品的外觀尺寸變大的情況下剪掉藝術品周圍的額外空間。注意，我修改了viewBoxandwidth和height屬性。
svg {
background: pink;
}<p>Before:</p>
<svg fill="#807c8c" width="45" height="45" version="1.1" viewBox="0 0 700 700" xmlns="http://www.w3.org/2000/svg">
<path style="stroke:#ffffff;stroke-width:5px;" d="m175 210c-3.0938 0-6.0625-1.2266-8.25-3.4141-2.1914-2.1875-3.418-5.1562-3.418-8.2539v-23.332c0.027344-21.652 8.6406-42.41 23.949-57.719s36.066-23.922 57.719-23.949h23.332c6.4453 0 11.668 5.2266 11.668 11.668s-5.2227 11.668-11.668 11.668h-23.332c-15.465 0.015625-30.293 6.1641-41.23 17.102s-17.086 25.766-17.102 41.23v23.332c0 3.0977-1.2266 6.0664-3.418 8.2539-2.1875 2.1875-5.1562 3.4141-8.25 3.4141zm361.67 175v-23.332c0-6.4453-5.2266-11.668-11.668-11.668s-11.668 5.2227-11.668 11.668v23.332c-0.015625 15.465-6.1641 30.293-17.102 41.23s-25.766 17.086-41.23 17.102h-23.332c-6.4453 0-11.668 5.2266-11.668 11.668s5.2227 11.668 11.668 11.668h23.332c21.652-0.027344 42.41-8.6406 57.719-23.949s23.922-36.066 23.949-57.719zm-256.67 70c0-3.0938-1.2266-6.0625-3.4141-8.25-2.1875-2.1914-5.1562-3.418-8.2539-3.418h-23.332c-15.465-0.015625-30.293-6.1641-41.23-17.102s-17.086-25.766-17.102-41.23v-23.332c0-6.4453-5.2266-11.668-11.668-11.668s-11.668 5.2227-11.668 11.668v23.332c0.027344 21.652 8.6406 42.41 23.949 57.719s36.066 23.922 57.719 23.949h23.332c3.0977 0 6.0664-1.2266 8.2539-3.418 2.1875-2.1875 3.4141-5.1562 3.4141-8.25zm256.67-256.67v-23.332c-0.027344-21.652-8.6406-42.41-23.949-57.719s-36.066-23.922-57.719-23.949h-23.332c-6.4453 0-11.668 5.2266-11.668 11.668s5.2227 11.668 11.668 11.668h23.332c15.465 0.015625 30.293 6.1641 41.23 17.102s17.086 25.766 17.102 41.23v23.332c0 6.4453 5.2266 11.668 11.668 11.668s11.668-5.2227 11.668-11.668z"/>
</svg>
<p>After:</p>
<svg fill="#807c8c" width="28" height="28" version="1.1" viewBox="150 80 400 400" xmlns="http://www.w3.org/2000/svg">
<path style="stroke:#ffffff;stroke-width:5px;" d="m175 210c-3.0938 0-6.0625-1.2266-8.25-3.4141-2.1914-2.1875-3.418-5.1562-3.418-8.2539v-23.332c0.027344-21.652 8.6406-42.41 23.949-57.719s36.066-23.922 57.719-23.949h23.332c6.4453 0 11.668 5.2266 11.668 11.668s-5.2227 11.668-11.668 11.668h-23.332c-15.465 0.015625-30.293 6.1641-41.23 17.102s-17.086 25.766-17.102 41.23v23.332c0 3.0977-1.2266 6.0664-3.418 8.2539-2.1875 2.1875-5.1562 3.4141-8.25 3.4141zm361.67 175v-23.332c0-6.4453-5.2266-11.668-11.668-11.668s-11.668 5.2227-11.668 11.668v23.332c-0.015625 15.465-6.1641 30.293-17.102 41.23s-25.766 17.086-41.23 17.102h-23.332c-6.4453 0-11.668 5.2266-11.668 11.668s5.2227 11.668 11.668 11.668h23.332c21.652-0.027344 42.41-8.6406 57.719-23.949s23.922-36.066 23.949-57.719zm-256.67 70c0-3.0938-1.2266-6.0625-3.4141-8.25-2.1875-2.1914-5.1562-3.418-8.2539-3.418h-23.332c-15.465-0.015625-30.293-6.1641-41.23-17.102s-17.086-25.766-17.102-41.23v-23.332c0-6.4453-5.2266-11.668-11.668-11.668s-11.668 5.2227-11.668 11.668v23.332c0.027344 21.652 8.6406 42.41 23.949 57.719s36.066 23.922 57.719 23.949h23.332c3.0977 0 6.0664-1.2266 8.2539-3.418 2.1875-2.1875 3.4141-5.1562 3.4141-8.25zm256.67-256.67v-23.332c-0.027344-21.652-8.6406-42.41-23.949-57.719s-36.066-23.922-57.719-23.949h-23.332c-6.4453 0-11.668 5.2266-11.668 11.668s5.2227 11.668 11.668 11.668h23.332c15.465 0.015625 30.293 6.1641 41.23 17.102s17.086 25.766 17.102 41.23v23.332c0 6.4453 5.2266 11.668 11.668 11.668s11.668-5.2227 11.668-11.668z"/>
</svg>轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/430533.html
上一篇：如何影片填充svg的線性漸變？