Link berbentuk teks atau gambar, jika kita mengarahkan kursor ke link tersebut, maka kursor akan berubah dari bentuk panah menjadi tangan, yah sudah pada tau lah.
Untuk membuat link pada dokumen HTML menggunakan tag <a> dan atribut href
<html> <body> <a href="http://alusplus.blogspot.com">Ini sebuah link</a> </body> </html>Coba di sini! >>>
Pada contoh diatas alamat dari link nya di tentukan oleh atribut href.
Atribut Target
Dengan menggunakan atribut ini, maka saat kita men klik link tersebut maka akan terbuka pada tab baru<html> <body> <a href="http://alusplus.blogspot.com" target ="_blank">Link ini akan terbuka pada tab baru</a> </body> </html>Coba di sini! >>>
Contoh diatas menggunakan atribut target dan _blank sebagai nilainya (target ="_blank")
Gambar sebagai link
<html> <body> <a href="http://alusplus.blogspot.com"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFtRO0TPNBllFAVPMrml4jnXZMBTMdFpW7Bu7a01QVdT07sU6gLFydwITcOBoceokUYqaQFFh_vqEIa-ru4ibU4GXWcDI_Ca3jvDj6tPHiutJngEDn1YNeqe8pJjaJ_ViKV7oLnEvReqHI/s320/logo+alusplus.png"> </a> </body> </html>Coba di sini! >>>
Contoh di atas akan menghasilkan gambar sebagai link seperti gambar di bawah ini yang dapat kita klik
Link Menuju Lokasi atau bagian pada Halaman yang sama
<html> <body> <p><a href="#bagian3">Lihat bagian 3</a></p> <p><a href="#bagian6">Lihat bagian 6</a></p> <p><a href="#b10">Lihat bagian 10</a></p> <h2>Bagian 1</h2> <p>Isi................................</p> <h2>Bagian 2</h2> <p>Isi................................</p> <h2><a name="bagian3">Bagian 3</a></h2> <p>Isi................................</p> <h2>Bagian 4</h2> <p>Isi................................</p> <h2>Bagian 5</h2> <p>Isi................................</p> <h2><a name="bagian6">Bagian 6</a></h2> <p>Isi................................</p> <h2>Bagian 7</h2> <p>Isi................................</p> <h2>Bagian 8</h2> <p>Isi................................</p> <h2>Bagian 9</h2> <p>Isi................................</p> <h2><a name="b10">Bagian 10</a></h2> <p>Isi................................</p> </body> </html>Coba di sini! >>>
Saat kita klik link-link diatas pada contoh, maka browser akan otomatis menuju bagian tertentu pada halaman tersebut.
Link untuk mengirim Email
<html> <body> <p>Ini adalah link email: <a href="mailto:nama@contoh.com?Subject=Halo%20Kawan&body=Salam%20kenal%20sobat">Kirim email!</a> </p> </body> </html>Coba di sini! >>>
Contoh diatas akan menghasilkan link yang jika di klik akan mengirim email ke nama@contoh.com dengan subjek Halo Kawan serta isi Salam kenal sobat
Kirim email!
Spasi antara kata pada subjek dan isi memakai %20 untuk memastikan browser akan menampikan teks dengan benar.
Contoh lainnya untuk mengirim email ke banyak kontak
<html> <body> <p>Ini adalah link email: <a href="mailto:nama@contoh.com? cc=nama2@contoh.com&bcc=nama3@contoh.com&Subject=Undangan%20ulang%20tahun&body=Hai%20kawan-kawan%20kalian%20diundang%20untuk%20datang%20kepesta%20ulang%20tahunku">Kirim email!</a> </p> </body> </html>Coba di sini! >>>
Kirim email!
Contoh diatas akan mengirim email ke 3 alamat.
1 komentar:
semua yanga da di dunia blogging wajib tah cara membuat link sebab sangat penting sekali
Posting Komentar