Berikut adalah beberapa pilihan yang bisa anda gunakan untuk menampilkan gambar dengan kode html:
Gambar Biasa
Gambar diatas akan tampil sesuai ukuran asli gambar tersebut dan kodenya adalah sebagai berikut :
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFFgM-N4payi08IpGvqGjiDAVgGGhmLZ13c5bbXpdKtMY24pUau31v0nh3aG9QHRQfJw6AXOoSwseuFqh0lwQCUs81jL47DePYh86dUZqmfUwjlfdlbqRvcBXfSUSCHsCZ899ZtWIiZDBL/s220/4999_101259873218105_100000022786647_31479_7756476_n.jpg" />
Bila ingin gambar tersebut disertai dengan link ketika orang mengklik gambar tersebut maka bisa di tambahi kode berikut di atasnya :
<a href="http://istiqlaldutanet.blogspot.com/" > dan ditutup dengan kode </a>
maka kodenya akan menjadi seperti berikut :
<a href="http://istiqlaldutanet.blogspot.com/" > <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFFgM-N4payi08IpGvqGjiDAVgGGhmLZ13c5bbXpdKtMY24pUau31v0nh3aG9QHRQfJw6AXOoSwseuFqh0lwQCUs81jL47DePYh86dUZqmfUwjlfdlbqRvcBXfSUSCHsCZ899ZtWIiZDBL/s220/4999_101259873218105_100000022786647_31479_7756476_n.jpg" /></a>
dan hasilnya menjadi Seperti berikut :
Ketika anda klik gambar tersebut maka anda akan dibawa ke link yang anda pasang, adapaun bila ingin link nya terbuka di halaman baru maka anda bisa baca tutorial saya kemaren : Kumpulan Modifikasi Link
Dengan Ukuran Yang Diinginkan
adapun bila ingin menampilkan gambar dengan ukuran dengan ukuran yang kita inginkan maka bisa membuatnya dengan kode berikut :
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFFgM-N4payi08IpGvqGjiDAVgGGhmLZ13c5bbXpdKtMY24pUau31v0nh3aG9QHRQfJw6AXOoSwseuFqh0lwQCUs81jL47DePYh86dUZqmfUwjlfdlbqRvcBXfSUSCHsCZ899ZtWIiZDBL/s220/4999_101259873218105_100000022786647_31479_7756476_n.jpg" width="120" border="0" />
Maka Ukuran lebarnya akan sesuai dengan yang kita inginkan, sedangkan tingginya akan menyesuaikan sendiri sesuai ukuran aslinya , adapaun bila ingin ukuran panjang lebarnya di buat sesuai keinginan anda maka bisa dengan ditambahi kode height dan bordernya di hilangkan, contohnya adalah berikut :
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFFgM-N4payi08IpGvqGjiDAVgGGhmLZ13c5bbXpdKtMY24pUau31v0nh3aG9QHRQfJw6AXOoSwseuFqh0lwQCUs81jL47DePYh86dUZqmfUwjlfdlbqRvcBXfSUSCHsCZ899ZtWIiZDBL/s220/4999_101259873218105_100000022786647_31479_7756476_n.jpg" width="120" Height="50" />
Dengan Title ( Muncul Tulisan Ketika Disorot )
Contohnya adalah berikut ini
Ketika Mouse diarahkan ke gambar akan muncul title/tulisan , untuk membuatnya adalah dengan menambahkan title , seperti berikut ini :
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFFgM-N4payi08IpGvqGjiDAVgGGhmLZ13c5bbXpdKtMY24pUau31v0nh3aG9QHRQfJw6AXOoSwseuFqh0lwQCUs81jL47DePYh86dUZqmfUwjlfdlbqRvcBXfSUSCHsCZ899ZtWIiZDBL/s220/4999_101259873218105_100000022786647_31479_7756476_n.jpg" title="Muncul Tulisan" />
Itulah Beberapa Contoh Kode yang bisa digunakan untuk menampilkan gambar dengan kode Html, Silahkan anda kreasikan sendiri dengan keinginan anda , Semoga Bermanfaat bagi anda
Sekian dan Terima kAsihhh !!!
--- Share Yaa Bro ----
Hubungi saya jika Anda menemukan konten yang rusak, aneh atau tidak berhasil Anda terapkan. Silahkan beritahu kami dengan klik : Contact Me! . Kami akan berusaha membalas atau memperbaiki konten secepatnya. Terima Kasih.
2komentar:
Tutorial yg bermanfaat. Sukses selalu.
Post a Comment