Sabtu, 06 April 2013

Komponen Property Dalam CSS

Property Text Style


Property text style bisa anda gunakan untuk membuat gaya tulisan anda pada web. Adapun komponen text style atau yang berhubungan dengan model atau gaya tulisan/font dari CSS adalah sebagai berikut ini :

  • color
Property ini mengontrol warna dari text penulisannya.
Selector { color : #000000 }
Value bisa berupa warna hexadesimal, atau bisa juga berupa tulisan. Misal untuk warna kuning kita bisa gunakan yellow. 

  • font-weight
Property ini mengontrol tebal dari teks penulisannya .  
Selector { font-weight:100 }
Value bisa anda tulis dengan angka mulai dari 100 dan dilanjutkan dengan kelipatannya atau bisa anda tulis dengan kata 'Bold' atau yang lain.

  • font-family
Property ini digunakan untuk mengatur jenis font yang anda gunakan.
Selector { font-family : arial, Helvetica, san-serif }
Untuk jenis font sebaiknya menggunakan bawaan Windows, jika ingin terbaca oleh seluruh user.

  • font-size 
Property ini digunakan untuk mengatur ukuran font yang anda gunakan.  
Selector { font-size : 12px }
Untuk mengatur ukuran font, anda bisa menggunakan ukuran.. px, em, atau small, medium, large dan lain-lain.

  • font-variant
Property ini digunakan untuk mengatur font yang akan muncul apakah menggunakan huruf kecil atau small caps.
Selector { font-variant : small-caps } atau anda bisa menggunakan normal

  • font-style
Property ini digunakan untuk mengatur style font yang akan digunakan pada text.
Selector { font-style : italic } atau pilihan value lain seperti normal, oblique.

  • text-decoration
Property ini digunakan untuk mengatur style font lanjutan dari font style.  
Selector { text-decoration : underline} atau value lain : line trough, normal, blink, overline.

  • text-transform
Property ini digunakan untuk mengatur kapital font.  
Selector { text-transform : lowercase }, value lain : uppercase, capitalize.

Property Text Layout


Property text layout ini berfungsi untuk mengatur bagaimana efek dari suatu layout suatu tulisan pada halaman website. Property ini lebih berfokus pada penempatan dan tampilan yang ditempatkan pada halaman web anda. Anda bisa mengombinasikan antara tampilan page layout dan text layout supaya tampilan website anda lebih elegant dan sesuai dengan keinginan anda tentunya dan itu yang jelas tidak bisa anda dapatkan pada HTML.

Berikut ini property nya :

  • letter-spacing
Propertty ini digunakan untuk mengontrol jarak space antar karakter.  
Selector { letter-spacing : normal } , untuk value normal maka akan diatur oleh web browser sebagai bentuk justify text.

  • word-spacing
Property ini digunakan untuk mengontrol jarak space antar text atau kata.  
Selector { word-spacing : normal }
 
  • line-height
Property ini digunakan untuk mengatur jarak line atau garis.  
Selector { line-height : normal } 

  • text-indent
Property ini digunakan untuk mengatur dari baris pertama yang masuk agak ke dalam, property ini biasanya digunakan di awal paragraph.
Selector { text-indent : 50px }
 
  • text-align
Property ini digunakan untuk mengatur posisi dari text.  
Selector { text-align : justify }, value lain : left, right, center.

  • vertical-align
Property ini digunakan untuk mengontrol jarak space antar text atau kata.  
Selector { vertical-align : top }, value lain : text-top, text-botoom, bottom, middle, baseline, sub, super.

  • direction
Property ini digunakan untuk mengatur dan menentukan arah dari suatu tulisan pada sebuah website. Selector { direction : ltr }, atau value lain : rtl.
Keterangan : ltr = tulisan yang terbaca dari kiri ke kanan, rtl = tulisan yang terbaca dari kanan ke kiri

  • unicode-bidi
Property ini digunakan untuk mengontrol dan mengarahkan pada tulisan pada unicode.
Selector { unicode-bidi : bidi-override } , value lain : normal, embed.

1 komentar:

  1. pak fahmi tugas database , buat liburan 4 hari un belum di post ya pa ??

    Aditya Darmawan
    X RPL 2

    BalasHapus