Selasa, 16 Desember 2014

Membuat Teks Underline (Garis Bawah) Berwarna

Membuat Teks Underline (Garis Bawah) Berwarna - Pada artikel kemarin saya sudah membuatkan tentang teks diantara dua garis atau teks berada ditengah garis dan sekarang saya akan mebuatkan panduan tentang membuat teks underline atau garis bawah berwarna

Silahkan baca dulu Membuat teks diantara dua garis

Membuat Teks Underline (Garis Bawah) Berwarna

ini Demonya


Cara Membuat Teks Underline (Garis Bawah) Berwarna
Jika Anda tertarik untuk membuat teks underline atau garis bawah seperti Demo diatas, silahkan ikuti caranya berikut ini:

Salin kode CSS berikut ini kedalam kode template blog Anda
CSS
.textu a {
text-decoration: none;
}
.textu a:link {
color: #0fead3;
border-bottom: 1px solid #0fead3;
}
.textu a:visited {
color: #0fead3;
border-bottom: 1px solid #c0c0c0;
}
.textu a:active {
color: #0fead3;
border-bottom: 1px dashed #ff0000;
}
.textu a:hover {
color: #fd8f01;
border-bottom: 2px dashed #fd8f01;
}

HTML
Salin dan sesuaikan kode markup HTML untuk teks underline atau garis bawah berwarna berikut ini
<div class="textu"><a href="#">www.PanduanTemplateBlog.com</a></div>

Arahkan kursor mouse ke kolom teks berikut untuk melihat efek garis bawah berwarna


Mudah bukan untuk membuat teks underline atau garis bawah berwarna ini karena hanya memanfaatkan kode css saja dan jika Anda ingin memasangnya secara otomatis dan terpasang pada seluruh halaman blog, hilangkan kode class .textu sehingga hyperlink yang ada didalam blog Anda akan memiliki efek teks garis bawah berwarna. Terimakasih

Membuat Teks Underline (Garis Bawah) Berwarna Rating: 4.5 Diposkan Oleh: ana sriwahyuni

28 komentar:

  1. bagus bu ana saya mau coba buat blog yg lainnya.. terima kasih

    BalasHapus
    Balasan
    1. terimakasih banyak juga mas Rama, semoga bermanfaat..

      Hapus
    2. amiin.. sangat bermanfa'at sekali.

      Hapus
  2. linknya jadi lebih menarik ya mbak, kalo warna-warni :D

    BalasHapus
    Balasan
    1. iya mas Indra, lebih menarik lagi jika disesuaikan dengan keinginan :)

      Hapus
  3. Terima kasih info nya.. :)
    cantik juga kalau di buat begini..

    BalasHapus
    Balasan
    1. sama-sama mbak Fidah, terima kasih kembali.. :)

      Hapus
  4. atraktif hasilnya, jadi lebih menarik perhatian pengunjung...makasih mba triknya

    BalasHapus
    Balasan
    1. iya mas Wong, lebih unik kan :)
      terimakasih banyak juga mas...

      Hapus
  5. Menarik sekali hasilnya buk Ana...Terima kasih sharenya...

    BalasHapus
    Balasan
    1. terimakasih Uda.. semoga bermanfaat.. :)

      Hapus
  6. Balasan
    1. sama-sama mbak Ipah... terimakasih banyak... :)

      Hapus
  7. nah pengetahuan saya nambah lahi nih seumur-umur ng'blog ngga pernah ngeh jika ternyata ada hal menarik untuk memperindah artikel dengan memberi garis bawah yang berwarna warni, ternyata harus memasang kode di atas itu ya bu sebab selama ini garis bawah sangat jarang saya pake dalam postingan, selain juga seringkali garis bawah yang biasa dan ada tersedia itu ngga valid HTML5...gituh buk.

    BalasHapus
    Balasan
    1. hanya sebagai referensi saja mas, semoga bermanfaat..
      kalau untuk valid HTML5 bisa disesuaikan saja mas dan untuk setiap tutor yang ada di blog ini tidak selalu mengacu pada validitas saja :)

      Hapus
  8. jadi makin keren dan berwarna ya hover link nya, bagus juga ni untuk menambah cantik tampilan blog kita.

    BalasHapus
    Balasan
    1. iya mas Arie, silahkan di coba mas :)

      Hapus
    2. apanya yang mau di coba mas Yanto?

      Hapus
    3. teksnya underlinnya dong mbak,biar terlihat lebih profesional
      masak mau coba yg lain.hehehe

      Hapus
  9. cantik juga ya, perpaduan warnanya bisa pilih pilih ga ya..

    BalasHapus
    Balasan
    1. bisa mbak Tika, bisa disesuaikan dengan keinginan :)

      Hapus
  10. weh kren saya coba terapin nanti pas buat tutorial

    BalasHapus
    Balasan
    1. silahkan mas Em, semoga bermanfaat ya..

      Hapus
  11. keren habis nih,bisa berganti warna dlm sekejap.
    teks ini apa bisa digunakan untuk judul artikel yambak?

    BalasHapus
    Balasan
    1. untuk warna bisa disesuaikan mas agar bisa lebih keren lagi.. bisa banget mas Yanto..

      Hapus
    2. ok deh kalau gitu
      makasih sharingnya

      Hapus
  12. wah keren mbak artikelnya nanti tak coba :)

    BalasHapus

Demi kenyamanan bersama, tidak boleh memasang link dalam bentuk apapun, komentar yang berisi link tidak akan diterbitkan
Terimakasih

Direktori

direktori weblogger
Direktori WeBlog Indonesia