Jumat, 24 Februari 2017

CSS- Warna / Background / Border

   No comments

kali ini saya akan share tentang cara memilih warna yang pas dengan menggunkan css.

Assalamulaikum wr.wb
     Untuk lebih lanjutnya setelah mengenal CSS selanjutnya saya akan berbagi bagaimana menerapkan warna,background,border pada CSS

Latar Belakang
     Warna,background dan border merupakan bagian yang berguna untuk memperindah tampilan dari halaman web. CSS memberikan berbagai tag dan perintah yang berguna untuk merubah berbagai tampilan warna,background dan border.

Tujuan
     Mempelajari Beberapa perintah yang berfungsi mengatur warna,background dan border menggunakan CSS.

Pembahasan dan Langkah Kerja
  • WARNA 
Warna dalam CSS yang paling sering ditentukan oleh:
1. Nilai RGB :
    Warna RGB adalah model warna additive yang bertujuan sebagai penginderaan dan presentasi gambar dalam tampilan visula dalam peralatan elektronik seperti komputer,televisi dan fotografi. 
Warna RGB difungsikan untuk tampilan di komputer karena warna latar komputer Hitam. 
   R : Red (Merah)
   G : Green (Hijau)
   B : Blue (Biru)

Contoh : 

Format warna RGB
 2.Warna Hexadesimal 
         Warna Hexadesimal sebenarnya merupakan sebuah penyebutan untuk penulisan kode warna diantara jenis kode warna lainnya . khususnya untuk halaman web/blog . karena itulah disebut dengan hexa color code.penulisannya menggunakan angka 0 - 9 . jumlah kodenya 6 karakter bisa terdiri dari huruf saja angka saja atau gabungan dari keduanya dan penandanya menggunakan pagar sebelum penulisannya.

Contoh :
format warna hexadesimal
Warna tersebut berlaku pada hampir seluruh penerapan CSS contoh untuk mengatur warna font,background,tabel,border  .

1. Font-CSS
Script CSS Pewarnaan Font

Hasil
2. Background-CSS

Script background warna

Hasil
3. Border atau batas
      The border-style properti menentukan jenis perbatasan apa yang akan ditampilkan.
    Nilai-nilai berikut yang diizinkan :
  • dotted - Mendefinisikan perbatasan bertitik
  • dashed - Mendefinisikan perbatasan putus-putus
  • solid - Mendefinisikan sebuah perbatasan yang solid
  • double - Mendefinisikan perbatasan ganda
  • groove- Mendefinisikan sebuah perbatasan berlekuk 3D.Efeknya      tergantung  
  • pada nilai border-color
  • ridge- Mendefinisikan sebuah perbatasan bergerigi 3D. Efeknya tergantung
  • pada nilai border-color
  • inset- Mendefinisikan sebuah perbatasan inset 3D. Efeknya tergantung pada
  • nilai border-color
  • outset- Mendefinisikan sebuah perbatasan awal 3D. Efeknya tergantung pada
  • nilai border-color
  • none - Mendefinisikan ada batas
  • hidden - Mendefinisikan perbatasan tersembunyi
    • Script style css
Hasil
 Lebar border dapat diatur dengan satuan px :
Pengaturan ukuran pada CSS
Warna border dapat diatur :
Pengaturan warna yang berbeda 4 sisi

Pengaturan warna semua sisi sama
Style yang berbeda pada satu paragraf

style border
Hasil dua style border
Contoh tersebut diatas menggunakan dua style bordernya dengan sekaligus.

Cukup sekian apa yang dapat saya sampaikan semoga bermanfaat Terimakasih Wassalamualaikum wr.wb

0 komentar:

Posting Komentar