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..!!