Latest Updates

Memansang Image dan Link pada HTML


HTML Image & Link


Pada postingan saya sebelumnya saya telah membahas sedikit tentang HTML dan di postingan kali ini kita akan membahas sedikit lebih jauh tentang HTML dan menambahkan beberapa atribut pada HTML guna untuk mempercantik  Wbsait yang akan kita buat. Kali ini kita akan coba memasang Image dan Link.
  •         Image
Untuk memasukan gambar kita mamerlukan tag <img> yaitu tg untuk mendeskripsikan gambar, contoh:
<img src=gambar.jpg>
Dan kita bisa memasukan tipe file lainnya: gif, maupun png.
<img> : adalah tag untuk deskrpisi gambar, sedangkan
“src”    : adalah atribut untuk mencari alamat dari gambar.
Contoh:



Kemudian, kita juga mengatur besar sebuah gambar nya dengan format deskripsi:

“width” dan “height” contoh:
<img src=“pic_mountain.jpg” width=300 height=250>



  •         HTML Link

HTML link adalah hyperlink, yaitu jikan kita mengklik sebuah gambar atau text kita akan melompat ke halaman lain.
HTML Link menggunakan tag <a href> untuk mendeskripsikan nya.
Contoh:

<a href=”http://www.amikom.ac.id”>visit amikom</a>

-href : adalah atribut untuk menuju halaman web.
“visit amikom” adalah text judul yang muncul dan jika kita mengklik text tersebut kita akan masuk ke dalam alamt tujuan.
Nah, jika kita sudah mengetahui tag dari HTML Link, apabila kita ingin mendeskripsikan nya di dalam sebuah gambar maka kita tinggal kombin dengan tag dari “image”.

  •         Link Gambar

Tag nya adalah <a href> terlebih dahulu kemudian masukan tag <img>
Contoh:

<a href=”http://www.amikom.ac.id”><img src=amikom.jpg weight=”200” height=”250”></a>


  •       Target atribut

Target atribut menentukan di mana untuk membuka dokumen terkait.

Contoh ini akan membuka dokumen terkait dalam jendela browser baru atau tab baru:         

 <a href="http://www.w3schools.com/" target="_blank">Visit W3Schools!</a>

Format tag sama seperti “hyperlink” akan tetapi di <target=”_blank”> kita akan membuka jendela baru secara otomatis.

mungkin sekian postingan kali ini semoga bermanfaat :)


2 Responses to "Memansang Image dan Link pada HTML"