為 HTML 網站調整腓尼基字母的 SVG
P粉558478150
P粉558478150 2024-01-10 18:12:25
0
1
687

我正在嘗試改編在 Inkscape 中創建的開源 SVG,以便將其嵌入到我的實驗網站中,就像我對同一字母表中的其他 SVG 所做的那樣。

我網站上的腓尼基“mem”和“nun”SVG

#
<svg version="1.1" id="nūn" xmlns:svg="http://www.w3.org/2000/svg"
                xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-244 364 46.9 65"
                style="enable-background:new -244 364 46.9 65;" xml:space="preserve" class="symbol" title="nūn">
                <g id="layer1">
                    <path id="rect3131" d="M-238,365.1l-4.8,36.3l35.8-15.9l-2.6,41.9l8,0.5l3.4-55.2l-34.7,15.6l2.9-22.2L-238,365.1z"/>
                </g>
            </svg>

            <svg version="1.1" id="mēm" xmlns:svg="http://www.w3.org/2000/svg"
                xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-248.3 359 55.6 73.8"
                style="enable-background:new -248.3 359 55.6 73.8;" xml:space="preserve" class="symbol" title="mēm">
                <g id="path2220">
                    <path d="M-203.5,431.4l-6.8-4.2c7.1-11.5,9.7-22.3,8-32.8l-3.6-12l-10.5,18.8l-7-19.1l-8.7,18.1l-14.9-30.9l7.2-3.5
                        l7.7,16l9.8-20.2l7.5,20.5l11.2-20l9.3,30.8C-192.3,405.5-195.2,418.1-203.5,431.4z"/>
                </g>
            </svg>

在改編這個「waw」SVG 時,我最困惑的是:

  • 「waw」除了寬度和高度外沒有定義的視圖框,這似乎與「mem」和「nun」的視圖框有很大不同,例如「-248.3 359 55.6 73.8」。

  • 當我嘗試用自己的視圖框替換“waw”時,“waw”根本無法加載到我的頁面上。

我嘗試重寫的「waw」

<svg version="1.1" id="waw" xmlns:svg="http://www.w3.org/2000/svg"
                 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-251.1 354.8 60.4 83.5"
                 style="enable-background:new -251.1 354.8 60.4 83.5;" xml:space="preserve" class="symbol" title="waw">
                <g id="layer1">
                    <path id="rect2726" 
                          d="M 19.421875,5.015625 L 13.953125,10.890625 L 38.453125,33.734375 L 38.453125,79.984375 L 46.453125,79.984375 
                             L 46.453125,33.984375 L 71.046875,11.046875 L 65.609375,5.203125 L 42.609375,26.640625 L 19.421875,5.015625 z"/>
                </g>
            </svg>

我應該如何重寫這個 SVG,以便它使用正確的視圖框(相對於“mem”和“nun”)?

P粉558478150
P粉558478150

全部回覆(1)
P粉904405941

我將其載入到 SVG 編輯器中(Boxy SVG 是我最喜歡的),以將路徑與視圖框並清理它。

<svg viewBox="0 0 60.4 83.5" xmlns="http://www.w3.org/2000/svg">
  <path d="M 7.122 4.266 L 1.653 10.141 L 26.153 32.984 L 26.153 79.234 L 34.153 79.234 L 34.153 33.234 L 58.747 10.297 L 53.309 4.453 L 30.309 25.891 L 7.122 4.266 Z"/>
</svg>
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板