Hartanah Strok SVG
Harta Strok SVG
SVG menyediakan pelbagai sifat strok. Dalam bab ini kita akan melihat perkara berikut:
strok
stroke-lebar
stroke-linecap
stroke-dasharray
Semua sifat lejang yang boleh digunakan pada sebarang jenis baris, teks dan elemen seperti bulatan kontur.
Atribut lejang SVG
Atribut lejang mentakrifkan warna garisan, teks atau unsur unsur:
Berikut ialah kod SVG :
Instance
<!DOCTYPE html> <html> <body> <svg xmlns="http://www.w3.org/2000/svg" version="1.1"> <g fill="none"> <path stroke="red" d="M5 20 l215 0" /> <path stroke="black" d="M5 40 l215 0" /> <path stroke="blue" d="M5 60 l215 0" /> </g> </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).
Atribut lebar lejang SVG
Atribut lebar lejang T mentakrifkan ketebalan garisan, teks atau rangka elemen:
Berikut ialah kod SVG:
Instance
<!DOCTYPE html> <html> <body> <svg xmlns="http://www.w3.org/2000/svg" version="1.1"> <g fill="none" stroke="black"> <path stroke-width="2" d="M5 20 l215 0" /> <path stroke-width="4" d="M5 40 l215 0" /> <path stroke-width="6" d="M5 60 l215 0" /> </g> </svg> </body> </html>
Run Instance»
Klik "Run Instance" butang untuk melihat contoh dalam talian
Untuk pengguna Opera: Lihat fail SVG (klik kanan pada sumber pratonton grafik SVG).
Atribut cap garis lejang SVG
Atribut cap garis garisan mentakrifkan penamatan jenis laluan terbuka yang berbeza:
Berikut ialah kod SVG :
Instance
<!DOCTYPE html> <html> <body> <svg xmlns="http://www.w3.org/2000/svg" version="1.1"> <g fill="none" stroke="black" stroke-width="6"> <path stroke-linecap="butt" d="M5 20 l215 0" /> <path stroke-linecap="round" d="M5 40 l215 0" /> <path stroke-linecap="square" d="M5 60 l215 0" /> </g> </svg> </body> </html>
Run Instance»
Klik butang "Run Instance" untuk melihat dalam talian instance
Untuk pengguna Opera: Lihat fail SVG (klik kanan pada sumber pratonton grafik SVG).
Atribut stroke-dasharray SVG
Atribut strokedasharray digunakan untuk membuat garis putus-putus:
Berikut ialah kod SVG :
Untuk pengguna Opera: Lihat fail SVG (klik kanan pada sumber pratonton grafik SVG).
