Tahukah Anda?
Pencarian di blog ini menggunakan Mesin Pencari Buatan Indonesia!
Mari kita dukung!  Kunjungi dan gunakan Penjejak.com ! »

Jumat, 25 Mei 2012

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" />

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 :
  • href=http://cara-caranya.blogspot.com
  • src=" http://www.google.co.id/intl/id_id/images/logo.gif
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.


12 komentar:

  1. wah tutorialnya sangat bermanfaat...
    salam kenal dari saya Budidaya Jamur

    BalasHapus
  2. asiiiik aku jd bisa bikin link, kalo gambar yg slide show gimana gan...?http://autowild-and.blogspot.com/

    BalasHapus
    Balasan
    1. slide show bisa pakai tag , sama seperti cara memutar teks... kalo ada kesempatan, akan saya tulis tutorialnya...

      Hapus
    2. tag marquee... sori belum tetulis...

      Hapus
  3. mantap ilmunya neh,,mkch bos

    BalasHapus
  4. Makasih gan informasinya berbagi ya. http://blograhasiadownload.com

    BalasHapus
  5. Ini nih maksud ane gan. Thanks gan :D

    BalasHapus
  6. Alquran terjemah dengan tajwid blok warna alquranku
    Antony 081331828237
    alquranku
    Thx

    BalasHapus
  7. Teman - teman kesulitan untuk Belajar Komputer karena kesibukan? kini kami memfasilitasi kursus komputer jarak jauh via online, silahkan kunjungi website kami di asianbrilliant.com, Master Komputer, Kursus Online

    Ayah, Bunda..butuh guru untuk mengajar anak-anak dirumah ? kami memfasilitasi 1000 guru untuk anak-anak ayah dan bunda datang kerumah, silahkan kunjungi website kami di smartsukses.com, Bimbingan Belajar, Les Private

    BalasHapus
  8. sangat bermanfaat sekali buat blog baru saya sob..
    makasih banyak sobat..

    jangan lupa Kunjung balik kesini juga ya >> tutorialblogwiky.blogspot.com

    BalasHapus