Minggu, 13 April 2014
3 Cara Meletakan Gambar Pada Bahasa HTML
Gambar merupakan suatu elemen penting dalam sebuah halaman HTML untuk meningkatkan cita rasa sebuah website atau blog selain dari fungsionalitasnya. Penggunaan gambar pada halaman HTML bisa berupa ilustrasi di dalam tulisan/posting, foto, sponsor dll. Nah kali ini saya akan membahasa Cara Meletakan Gambar Pada Bahasa Pemrograman HTML, cara yang paling mudah untuk meletakan gambar biasanya menggunakan kode tag <img> ini merupakan modal awal untuk meletakan gambar pada pengaplikasian HTML begini strukturnya :
<img src="alamat-url-gambar.jpg" alt="Nama/Judul Gambar" />
tag <img> adalah tag yang unik saya rasa, karena kode tersebut tidak menjepit dengan kodenya melainkan menjepit dirinya sendiri coba kalian perhatikan pada kode terakhir dia menjepit dirinya sendiri dengan kode /> adalagi pengguna src dan alt apa fungsinya? penggunaan atribut src atau kependekan dari Source bertujuan untuk mengetahui alamat url sumber dari gambar itu sendiri. Sedangkan atribut alt atau kependekan dari alternatif teks berguna untuk meletakan tulisan/keterangan jika browser yang digunakan tidak mendukung penampilan menggunakan gambar.
ohya penempatan gambar bisa kalian modifikasi sendiri sesuai selera kalian dengan penambahan atribut align. Coba kalian perhatikan kode dibawah ini :
Text Dibawah :
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="bottom" />
Text Ditengah - tengah :
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="middle" />
Text Diatas :
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="top" />
Penggunaan align="bottom untuk membuat bagian bawah dari gambar rata dengan bagian bawah tulisan, dan gunakan align="middle" untuk membuat gambar berada di tengah-tengah tulisan, namun apabila kalian menginginkan bagian atas gambar rata dengan bagian atas tulisan (rata atas) maka kalian dapat menggunakan align="top".
Jika kalian ingin meletakan pada bagian kanan atau kiri? kalian bisa merubah atribut align="left" dan align="right" ohya untuk posisi ditengah atau align=center perlu modifikasi yang berbeda dengan penambahan tag <center>.
Kiri
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="left" />
Kanan
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="right" />
Tengah
<center>
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" />
</center>
Kalian juga dapat menambahkan backgroound halaman dengan gambar dengan cara meletakan pada tab <body> kemudian tambahkan dengan atribut background.
<body background="namagambarkalian.gif">
Supaya terlihat rapi gunakan gambar berukuran 800 X 600 piksel. atau kalian bisa menambahkan sesuai dengan ukuran halaman kalian. Itulah cara meletakan gambar pada pengaplikasian bahasa HTML,
Semoga Bermanfaat.
<img src="alamat-url-gambar.jpg" alt="Nama/Judul Gambar" />
tag <img> adalah tag yang unik saya rasa, karena kode tersebut tidak menjepit dengan kodenya melainkan menjepit dirinya sendiri coba kalian perhatikan pada kode terakhir dia menjepit dirinya sendiri dengan kode /> adalagi pengguna src dan alt apa fungsinya? penggunaan atribut src atau kependekan dari Source bertujuan untuk mengetahui alamat url sumber dari gambar itu sendiri. Sedangkan atribut alt atau kependekan dari alternatif teks berguna untuk meletakan tulisan/keterangan jika browser yang digunakan tidak mendukung penampilan menggunakan gambar.
ohya penempatan gambar bisa kalian modifikasi sendiri sesuai selera kalian dengan penambahan atribut align. Coba kalian perhatikan kode dibawah ini :
Text Dibawah :
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="bottom" />
Text Ditengah - tengah :
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="middle" />
Text Diatas :
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="top" />
Penggunaan align="bottom untuk membuat bagian bawah dari gambar rata dengan bagian bawah tulisan, dan gunakan align="middle" untuk membuat gambar berada di tengah-tengah tulisan, namun apabila kalian menginginkan bagian atas gambar rata dengan bagian atas tulisan (rata atas) maka kalian dapat menggunakan align="top".
Jika kalian ingin meletakan pada bagian kanan atau kiri? kalian bisa merubah atribut align="left" dan align="right" ohya untuk posisi ditengah atau align=center perlu modifikasi yang berbeda dengan penambahan tag <center>.
Kiri
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="left" />
Kanan
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="right" />
Tengah
<center>
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" />
</center>
Kalian juga dapat menambahkan backgroound halaman dengan gambar dengan cara meletakan pada tab <body> kemudian tambahkan dengan atribut background.
<body background="namagambarkalian.gif">
Supaya terlihat rapi gunakan gambar berukuran 800 X 600 piksel. atau kalian bisa menambahkan sesuai dengan ukuran halaman kalian. Itulah cara meletakan gambar pada pengaplikasian bahasa HTML,
Semoga Bermanfaat.
Langganan:
Posting Komentar (Atom)
Tidak ada komentar:
Posting Komentar