Rumah >hujung hadapan web >tutorial css >Bagaimanakah Saya Boleh Membenamkan Ikon Hebat Fon dalam Imej SVG?

Bagaimanakah Saya Boleh Membenamkan Ikon Hebat Fon dalam Imej SVG?

Barbara Streisand
Barbara Streisandasal
2024-11-23 04:42:42583semak imbas

How Can I Embed Font Awesome Icons within SVG Images?

Termasuk Ikon Hebat Fon dalam Imej SVG

Soalan:

Bagaimana saya boleh memasukkan Ikon Font Hebat ke dalam imej SVG saya? Menggantikan elemen dengan elemen tidak menghasilkan sebarang hasil.

Jawapan:

Kod yang disediakan tidak akan berfungsi kerana

Periksa lembaran gaya CSS Font Awesome untuk menentukan aksara Unicode khusus untuk ikon yang dikehendaki. Contohnya:

.icon-group:before                { content: "\f0c0"; }
.icon-cloud:before                { content: "\f0c2"; }

Untuk memasukkan ikon ke dalam SVG anda, gantikan kod asal anda dengan yang berikut:

<g><text x=&quot;12&quot; y=&quot;15&quot;>&amp;#xf0c2;</text></g></p>
<p>Dalam lembaran gaya anda, tambahkan yang berikut:</p>
<pre class="brush:php;toolbar:false">svg text {
   font-family: FontAwesome;
}

Jika anda menggunakan versi percuma Font Awesome 5 , gunakan keluarga fon berikut pengisytiharan:

svg text {
   font-family: 'Font Awesome 5 Free';
}

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Membenamkan Ikon Hebat Fon dalam Imej SVG?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn