Thursday, November 26, 2015

css - manipulasi color dan background

by Lindi Classic | in css at 2:24 AM

Assalamualaikum wr. wb.

Pada kesempatan kali ini saya akan menjelaskan kegunaan manipulasi color dan background pada CSS. Bentuk lain dari memanipulasi halaman web adalah dengan menentukan warna pada tulisan, menambahkan warna background, atau dengan menambahkan gambar sebagai background.

Beberapa property yang bisa digunakan untuk memanipulasi beberapa hal di atas, ditampilkan pada tabel di bawah ini.

Sebagai contoh, Buatlah file html dengan script sebagai berikut:

<html>
<head>
   <title>css manipulasi color dan background</title>
   <style type="text/css">
       .warna_background{
           background-color : lightgreen;
       }

       .warna_tulisan{
           color : red;
       }

       .gambar_background_satu{
           background-image : url(gambar/bg3.jpg);
           background-repeat : no-repeat;
       }

       .gambar_background_dua{
           background-image : url(gambar/bg4.jpg);
           background-repeat : repeat-y;
       }
   </style>
</head>
<body>
   <h3>css manipulasi color dan backgroud</h3>
   <hr>
   <table width="100%">
       <tr>
           <td class="warna_tulisan">
               Juventus adalah tim terbaik Italia
       <tr>
           <td class="warna_background">
               Juventus berdiri pada tahun 1897
   </table>

   <table width="100%" border="1">
       <tr>
           <td height="350" width="50%" class="gambar_background_satu" align="center" valign="center">
               Juventus scudetto pertama pada tahun 1905
           <td class="gambar_background_dua" align="right" valign="top">
               Juventus sudah mengumpulkan 33 scudetto sampai pada tahun 2015
   </table>
</body>
</html>

Bukalah file tersebut pada browser, dan hasilnya adalah sebagai berikut: