teks SVG
Teks SVG - Unsur <teks>
<teks> digunakan untuk mentakrif teks.
Contoh 1
Tulis teks:
Saya suka SVG
Berikut ialah kod SVG:
Instance
<!DOCTYPE html> <html> <body> <svg xmlns="http://www.w3.org/2000/svg" version="1.1"> <text x="0" y="15" fill="red">I love SVG</text> </svg> </body> </html>
Run Instance»
Klik butang "Run Instance" untuk melihat contoh dalam talian
Untuk pengguna Opera: Lihat fail SVG (klik kanan pada sumber pratonton grafik SVG).
Contoh 2
Teks diputar:
Berikut ialah kod SVG:
Contoh
<!DOCTYPE html> <html> <body> <svg xmlns="http://www.w3.org/2000/svg" version="1.1"> <text x="0" y="15" fill="red" transform="rotate(30 20,40)">I love SVG</text> </svg> </body> </html>
Jalankan Instance»
Klik butang "Run Instance" untuk melihat contoh dalam talian
Untuk Opera pengguna: Lihat Fail SVG (klik kanan pada sumber pratonton grafik SVG).
Contoh 3
Teks pada laluan:
Berikut ialah kod SVG:
Instance
<!DOCTYPE html> <html> <body> <svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink"> <defs> <path id="path1" d="M75,20 a1,1 0 0,0 100,0" /> </defs> <text x="10" y="100" style="fill:red;"> <textPath xlink:href="#path1">I love SVG I love SVG</textPath> </text> </svg> </body> </html>
Run Instance»
Klik butang "Run Instance" untuk melihat instance dalam talian
Untuk pengguna Opera: Lihat fail SVG (klik kanan pada sumber pratonton grafik SVG).
Contoh 4
Elemen boleh disusun dalam mana-mana bilangan kumpulan dengan <tspan> Setiap elemen <tspan> boleh mengandungi format dan kedudukan yang berbeza. Beberapa baris teks (dengan elemen <tspan>):
Beberapa baris:
Baris pertama Baris kedua
Berikut ialah kod SVG:
Instance<!DOCTYPE html> <html> <body> <svg xmlns="http://www.w3.org/2000/svg" version="1.1"> <text x="10" y="20" style="fill:red;">Several lines: <tspan x="10" y="45">First line</tspan> <tspan x="10" y="70">Second line</tspan> </text> </svg> </body> </html>
Untuk pengguna Opera: Lihat fail SVG (klik kanan pada sumber pratonton grafik SVG).
Saya suka SVG
di bawah Adakah kod SVG:
Instance<!DOCTYPE html> <html> <body> <svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink"> <a xlink:href="http://www.php.cn/" target="_blank"> <text x="0" y="15" fill="red">I love SVG</text> </a> </svg> </body> </html>
Untuk pengguna Opera: Lihat fail SVG (klik kanan pada sumber pratonton grafik SVG).
