Cara Memasukkan Gambar Pada HTML

Cara Memasukkan Gambar Pada HTML

Admin

11:47:00 AM

Gambar (Images) pada suatu website merupakan daya tarik tersediri bagi pengunjung sebuah web/blog. Kita dapat melengkapi informasi pada web dengan sebuah gambar sehingga pembaca/pengunjung blog akan lebih cepat mengerti akan point-point dari web tersebut.

Umumnya browser web dapat menampilkan inline images yaitu gambar yang ditampilkan dengan teks. Format-format gambar yang dapat ditampilkan broser web diantaranya: GIF, JPEG, PNG (Portable Network Graphic), XBM (X Bitmap) dan lain sebagainya.


Sebuah gambar yang kita masukkan (upload) pada sebuah web akan mempengaruhi kecepatan akses dari web tersebut. Maka dari itu kita perlu berhati-hati untuk menambahkan gambar. Semakin besar ukuran dari sebuah gambar yang kita masukkan pada web maka semakin banyak waktu dan kuota yang kita butuhkan untuk mengakses website tersebut.

Untuk memasukkan image pada dokumen html (Pastikan gambar berada didalam folder) dapat kita lakukan dengan menuliskan sintaks seperti dibawah:

<img src=namagambar.format>

Alignment Image

Untuk menerapkan Alignment image dengan teks kita dapat menerapkannya seperti contoh dibawah:

<p><img src="gambar.png" align ="bottom" width="100" height="50"> Teks </p>  
<p><img src="gambar2.png" align="middle" width="100" height="50"> Teks </p>  
<p><img src="gambar3.jpg" align="top" width="100" height="50"> Teks </p> 

Floating Images

Dengan cara ini kita akan memasukkan gambar dengan mengambang di kiri maupun dikanan suatu paragraf
Contoh:

<p><img src="gambar.png" align="left" width="100" height="100"> Ini adalah contoh sebuah paragraf dengan gambar berada disebelah kiri paragraf</p>  
 <p><img src="gambar.png" align="right" width="100" height="100"> Ini adalah contoh sebuah paragraf dengan gambar berada disebelah kanan paragraf</p>

Teks Alternatif Untuk Gambar

Teks Alternatif Untuk Gambar bertujuan untuk menampilkan teks karena browser tidak dapat menampilkan gambar. Hal ini bisa terjadi karena seseorang pengunjung web mematikan kemampuan untuk menampilkan gambar pada browsernya dikarenakan jaringan internet yang lambat, atau juga karena browser yang digunakan adalah browser yang hanya mendukung tampilan teks.
Contoh syntaks teks alternatif pada sebuah gambar:

<img src="image.png" alt="teks"> 

Baca Juga: Program Sederhana Menghitung Usia Dengan PHP Dan Jquery

Image Link

Image link adalah sebuah gambar yang apabila di klik akan menuju pada halaman/ website lain.
Contoh:

<a href="http://google.com" ><img border="1" src="gambar.gif" with="50" height="100"></a>

Demikian Cara Cara Memasukkan Gambar Pada HTML, Semoga Bermanfaat

Admin