[HTML PART 5] TAG GAMBAR & Link pada html

Exploit Tekloggers-Ok sekarang lanjut ke tutorial berikutnya yaitu menambahkan gambar & link pada Html yaitu dengan menyisipkan tag <images src=.... & penambahan link pada html.Seperti biasa biar enjoy klik play musik di bawah

Tag Gambar

Untuk menyisipkan gambar pada html gunakan tag <images src="url/lokasi gambar.jpg"> Contoh seperti ini:

   <img src="gambarku.jpg/>

Jika ingin Mengatur ukuran serta lokasi gambarnya sesuai yang kita inginkan tambahkan atributes seperti tutoriall sebelumnya ,jadi seperti ini:

  <img src="gambarku.jpg" height="70px" widht="70px" align="center">

Jika ingin memberi bingkai di sisi gambar tambahkan atributes border,jadi nya akan seperti ini :

  <img src="gambarku.jpg" height="70px" widht="70px" align="center" border="2px">

2 px= mengindikasikan ukuran bingkai

Tag Link

Untuk menambahkan sebuah link url pada html anda bisa menambahkan tag <a href"url link">text untuk dijadikan linknya</a>
Contoh:

  <a href="www.tekloggers.tech">Tekloggers </a>

maka pada halaman akan keluar tulisan tekloggers dan jika di klik akan menuju ke link tekloggers

Untuk membuat ketika link di klik terbuka pada tab bara kita harus menambahkan atribute _blank ,jadi seperti ini:

  <a href="www.tekloggers.tech" target="_blank">Tekloggers </a>

Menggabung Tag Gambar & link

Nah cara untuk menggabung tag gambar ini dengan link,jadi kita membuat gambar dan ketika gambar itu di klik maka akan menuju ke link yang kita inginkan,dengan cara menyisipkan tag <a href=""> lebih dahulu dan menaruh tag <img src=""> sebelum penutup tag </a>,jadi seperti ini :

  <a href="http://www." target="_blank" title="#"><img style="border:1px"  src="linkgambar.jpg" alt="#" width="150" height="150" /></a>

Contoh Penerapan pada Dokumen HTML :

  <html>
   <head>
      <title> Tag Gambar & Link</ title>
   </ head>
   <body> 
     <a href="http://www." target="_blank" title="#"><img style="border:1px"     src="linkgambar.jpg" alt="#" width="150" height="150" /></a>  
  </ body>

</ html>