Membuat Garis Berwarna Pada Teks

Text With Border Color

Membuat Garis Berwarna Pada Teks - Dengan pemberian elemen "Underline" pada sebuah teks yang kita anggap penting, cukup menuliskan fungsinya seperti ini: <u>Membuat Garis Berwarna Pada Teks</u> maka teks sudah diberi garis bawah (text-decoration:underline). Namun bukan itu yang akan kita terapkan dalam tutorial kali ini, seperti pembahasan terdahulu tentang » Cara Membuat Border Pada Judul Artikel Blog adalah kegiatan untuk membuat title judul menjadi menarik dengan border-line, efek kali ini akan jauh lebih menarik dan keren untuk memberikan hiasan garis berwarna pada teks tulisan Anda seperti ini:

DEMO SHOW

SB-77 DESIGN

SAHABAT BLOGGER 77

DEVY INDRIYANI

Memberi garis berwarna disisi TEKS, bukan dibawah teks. Sehingga teks yang menurut Anda penting seperti judul postingan, sub judul atau poin-poin penting saat Anda memberikan informasi tips akan terlihat lebih cantik dan menarik hanya dengan penggunaan CSS seperti ini:

<style type="text/css">
.text-line span {padding:10px;background:#fff}
.text-line.right {text-align:right}
.text-line.center {text-align:center}
.text-line {background-color:red;height:3px;vertical-align:middle;line-height:1px}
p {font:bold 18px Verdana,sans-serif}
</style>

Pada pengaturan CSS diatas, saya memberikan 3 model tampilan warna garis pada teks, Anda tinggal memilih style mana yang menurut Anda berkesan untuk dipasang dalam postingan blog Anda. HTML lengkapnya seperti ini:

<p class="text-line"> <!--letak garis disebelah kanan teks-->
<span>SAHABAT BLOGGER 77</span></p>

<p class="text-line right"> <!--letak garis disebelah kiri teks-->
<span>SAHABAT BLOGGER 77</span></p>

<p class="text-line center"> <!--letak garis disebelah kanan dan kiri teks-->
<span>DEVY INDRIYANI</span></p>

Sederhana, mudah dan terlihat lebih menarik dibanding hanya membuat garis bawah pada teks yang kita inginkan. Sambil memikirkan teks yang akan Anda berikan garis berwarna seperti diatas, bagaimana kalau sambil menikmati » 10 Gaya Efek CSS Animasi Pada Teks yang sudah admin rangkum terspesial untuk sahabat semua pecinta SAHABAT BLOGGER 77, saya harap semoga terhibur. Terimakasih dan happy blogging..!!