Belajar Membuat Text Decoration

Assalamualaikum Sahabat Ikut Belajar Blog, tetap semangat yach belajarnya. dipostingan sebelumnya kita Belajar Mengubah Text Case Pada CSS. sekarang kita Belajar Membuat Text Decoration Pada CSS.
langsung saja ya.






Membuat Text Decoration

Anda dapat membuat text decoration seperti underline, overline, line-trough,  maupun blink dengan properti

text-decoration : option;

dengan option dapat diganti dengan underliner, overline, line-trough atau blink. Untuk melihat perbedaannya, perhatikan contoh berikut.

<!DOCTYPE   html   PUBLIC   "-//W3C//DTD   XHTML   1.0   Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html   xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>CSS   Guide</title>

<style   type="text/css">

#heading1   {
text-decoration   :   blink;     /*   membuat   teks   berkelap   kelip   */
}

#heading2   {
text-decoration   :   line-through;
/*   membuat   garis   ditengah   text/   dicoret   */
}

#heading3   {
text-decoration   :   underline;   /*   membuat   garis   bawah   */
}

#heading4   {
text-decoration   :   overline;   /*   membuat   garis   di   atas   text   */
}

</style>
</head>

<body>

<h1  id="heading1">Ini  Judul  Heading  1</h1>
<h1  id="heading2">Ini  Judul  Heading  2</h1>
<h1  id="heading3">Ini  Judul  Heading  3</h1>
<h1  id="heading4">Ini  Judul  Heading  4</h1>

</body>
</html>

Tampilan dari code di atas adalah sebagai berikut, akan tetapi untuk efek blink pada heading 1 tidak kelihatan ketika di screen shot.


Post a Comment

Silahkan Berkomentar Dengan Baik dan Sopan
No Spam
No Link

Terima Kasih Telah Berkunjung Ke Blog ini