Cara Membuat Link dan Menyisipkan Gambar di HTML

 

Kali ini kita akan belajar HTML lebih dalam lagi, yaitu mengenai pembuatan link dan penyisipan gambar. Selain itu juga akan penulis kenalkan pada pemakaian atribut untuk link dan gambar untuk situs web.

Cara Membuat Link

Untuk menyisipkan link, digunakan tag <a>. Susunan sederhananya adalah :

<a href=”URL”>Teks</a>

Contoh penulisannya :

<a href=”http://cara-caranya.blogspot.com”>Ini Link Menuju ke Tip Komputer dan Internet</a>

Hasilnya, sebaris kata “Ini Link Menuju ke Tip Komputer dan Internet” akan berubah menjadi objek link yang siap di-klik pengunjung.

Cara Menyisipkan Gambar

Untuk menyisipkan GAMBAR, digunakan tag <img>. Susunan sederhananya adalah :

<img src=”URL GAMBAR” />

Contoh penulisannya :

<img src=”http://www.google.co.id/intl/id_id/images/logo.gif&#8221; />

Hasilnya, gambar logo Google akan tampil di browser.

Gambar Logo Google
Gambar Logo Google

Gambar juga bisa dijadikan sebuah link, caranya cukup menempatkan tag <img> di antara tag <a> :

<a href=”URL”><img src=”URL GAMBAR” /></a>

Mengenal Atribut

Beberapa tag HTML menggunakan atribut. Atribut merupakan informasi tambahan yang disisipkan ke sebuah tag pembuka. Susunannya adalah namaatribut=”nilai”.

Jika Anda perhatikan kembali, contoh tag <a> dan <img> di atas disertai atribut :

Atribut href dipakai untuk merujuk URL target link, sedangkan atribut src dipakai untuk merujuk URL target gambar yang akan ditampilkan. Tag <a> dan <img> juga dapat diberi beberapa atribut lainnya.

Sebagian besar tag HTML dapat disisipi atribut. Ada beberapa atribut yang bisa diterapkan di berbagai tag, namun ada juga atribut yang hanya bisa diterapkan ke tag tertentu, seperti tag <a>dan <img> di atas.

Atribut antara lain lazim dipakai untuk memformat style teks dan gambar, mengatur warna, dan mengatur tabel.

 
  • style=”background-color:red” (mengatur warna latar menjadi merah)
  • style=”font-size:12px” (mengatur ukuran hurud menjadi 12 piksel)
  • style=”font-family:Verdana” (mengatur teks menggunakan font Verdana)
  • style=”text-align:center” (mengatur teks menjadi rata tengah)
 

Contoh pemakaiannya, coba sisipkan atribut style pada tag <BODY> agar warna halaman web menjadi merah :
<BODY style=”background-color:red”>

Sebagai referensi, daftar lengkap tag HTML dan atribut yang dapat menyertainya bisa Anda lihat di situs internet : http://www.w3schools.com/tags/default.asp.

 

Silahkan mencoba sob…

Thanks.

Yudhan.

About these ads

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Logout / Ubah )

Twitter picture

You are commenting using your Twitter account. Logout / Ubah )

Facebook photo

You are commenting using your Facebook account. Logout / Ubah )

Google+ photo

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s