Malisa Huzaifa - Web Multimedia HTML6 Canvas & SVG

109 width="5"/>. Sampai pada bagian ini kita telah selesai untuk merancang sebuah kotak yang memilik garis tepi dengan warna biru. Selanjutnya kita akan membuat sebuah persegi panjang yang mana langkahnya hampir sama dengan membuat kotak. Kita gunakan code <h1>Persegi Panjang </h1> untuk menampilkan informasi dari gambar yang akan dibuat. Kemudian masuk kebagian pembuatan persegi panjang dengan menggunakan <svg id="persegipanjang">..</svg> dan pada bagian dalam svg persegi panjang kita dapat gunakan <rect x="10" y="10" width="150" height="100" stroke="green" fill = "transparent" strokewidth="5"/>. Dari penggalan code ini kita dapat jelaskan bahwa titik awal untuk menggambarkan persegi panjang dimulai dari titik (10,10) dan ukuran panjang 150 dengan tinggi 100. Warna garis untuk persegi panjang kita setting dengan warna hijau dan untuk fill transparan dengan ketebalan garis 5. Berikut ini adalah hasil program ketika kita jalankan dimana pada window muncul untuk bagian atas informasi tulisan kotak yang bagian bawah dari tulisan tersebut diiringi dengan gambar kotak yang berwarna biru. Kemudian pada bagain bawah setelah kotak terdapat kembali sebuah tulisan sebagai info bawah yang akan ditampilkan selanjutnya adalah persegi panjang dimana persegi panjang yang tampil sesuai dengan code yang telah kita buat dengan warna hijau.

RkJQdWJsaXNoZXIy MTM3NDc5MQ==