Penerapan CSS (Part 1)

I.Latar Belakang.
Latar belakang kali ini kita masih mengenal sintag tentang CSS untuk memperindah tamoilan web / program.

II.Alat dan Bahan.

  Laptop / PC
  W3SCHOOLS
  Sublime text

III.Tujuan.
 untuk mengetahui langkah dasar untuk membuat web yang sederhana.

IV.Penjelasan.

Warna CSS

Warna dalam CSS yang paling sering ditentukan oleh:
  • nama warna yang valid - seperti "merah"
  • nilai RGB - seperti "rgb (255, 0, 0)"
  • nilai HEX - seperti "# ff0000"

Nama warna

Warna diatur dengan menggunakan nama warna
Contoh :
 Maka outputnya :

 

RGB (Red, Green, Blue)

RGB nilai warna dapat ditentukan menggunakan rumus ini: rgb (merah, hijau, biru).
Setiap parameter (merah, hijau, biru) mendefinisikan intensitas warna antara 0 dan 255.
Misalnya, rgb(255,0,0)ditampilkan sebagai merah, karena merah diatur ke nilai tertinggi (255) dan yang lainnya diatur ke 0. Percobaan dengan mencampur nilai-nilai RGB berikut
Contoh :
 Maka outputnya :


sa abu-abu sering didefinisikan menggunakan nilai yang sama untuk semua sumber cahaya 3
Contoh :

 Maka outputnya :

Warna heksadesimal

Nilai-nilai RGB juga dapat ditentukan dengan menggunakan heksadesimal nilai warna dalam bentuk: # RRGGBB , di mana RR (merah), GG (hijau) dan BB (biru) adalah nilai-nilai heksadesimal antara 00 dan FF (sama seperti desimal 0-255).
Misalnya, #FF0000ditampilkan sebagai merah, karena merah diatur ke nilai tertinggi (FF) dan yang lainnya diatur ke nilai terendah (00). Catatan: nilai HEX adalah case-sensitive: "# ff0000" adalah sama dengan "FF0000".

Contoh :
 Maka outputnya :

Nuansa abu-abu sering didefinisikan menggunakan nilai yang sama untuk semua sumber cahaya 3

Contoh :

CSS Backgrounds

Dengan CSS, warna yang paling sering ditentukan oleh:
  • nama warna yang valid - seperti "merah"
  • nilai HEX - seperti "# ff0000"
  • nilai RGB - seperti "rgb (255,0,0)"

 Contoh :

 Maka outputnya :

 

Gambar latar belakang

The background-imageproperti menentukan gambar untuk digunakan sebagai latar belakang suatu elemen.
Secara default, gambar diulang sehingga mencakup seluruh elemen.

Contoh :

 Maka outputnya :


 


ckground Image - Ulangi horizontal atau vertikal

Secara default, background-imageproperti mengulangi gambar secara horisontal dan vertikal.
Beberapa gambar harus diulang hanya horizontal atau vertikal, atau mereka akan terlihat aneh, seperti ini

Contoh :

 Maka outputnya :



Background Image - Atur posisi dan no-repeat

Menunjukkan gambar latar belakang hanya sekali juga ditentukan oleh background-repeatproperti

Contoh :
 Maka outputnya :


dalam contoh di atas, gambar latar belakang ditampilkan di tempat yang sama seperti teks. Kami ingin mengubah posisi gambar, sehingga tidak mengganggu teks terlalu banyak.
Posisi gambar ditentukan oleh background-positionproperti

Contoh :
 Maka outputnya :

V.Kesimpulan.
CSS adalah bahasa yang menggambarkan gaya dari sebuah dokumen HTML.

VI.Refrensi.
    http://www.w3schools.com/css

Komentar

Postingan Populer