Properties CSS

Di dalam code CSS kita mengenal tiga komponen yaitu selector, property, dan value. Khusus untuk property, kita bisa membagi property ini kedalam beberapa kelompok.

Font properties

Font property berhubungan dengan semua modifikasi tampilan pada font.

 Property Value
font
font-family
  • font-name
font-size
  • size
  • percentage
  • keywords
font-style
  • italic
  • oblique
  • normal
font-weight
  • weight-value
  • weight-keyword
font-variant
  • small-caps

Text properties

Kita bisa menggunakan code text properties untuk mengontrol tampilan pada text.

 Property Value
letter-spacing
  • size
word-spacing
  • size
text-decoration
  • line-through
  • overline
  • underline
  • none
vertical-align
  • vertical-values
text-transform
  • capitalize
  • uppercase
  • lowercase
text-align
  • right
  • center
  • left
  • justify
text-indent
  • size
  • percentage
line-height
  • size
  • percentage

Box properties

Box properties ini berhubungan dengan beberapa modifikasi tampilan di sekitar element HTML seperti border, margin, dan padding.

 Property Value
  • margin
  • margin-bottom
  • margin-left
  • margin-top
  • margin-right
  • size
  • percentage
  • auto
  • padding
  • padding-bottom
  • padding-left
  • padding-top
  • padding-right
  • size
  • percentage
  • four-sides
  • border
  • border-bottom
  • border-left
  • border-top
  • border-right
  • solid
  • double
  • groove
  • dotted
  • dashed
  • inset
  • outset
  • ridge
  • hidden
  • four-sides
  • width-key-term
  • border-width
  • border-bottom-width
  • border-left-width
  • border-top-width
  • border-right-width
  • size
  • width-key-term
  • border-color
  • border-bottom-color
  • border-left-color
  • border-top-color
  • border-right-color
  • color
  • border-style
  • border-bottom-style
  • border-left-style
  • border-top-style
  • border-right-style
  • solid
  • double
  • groove
  • dotted
  • dashed
  • inset
  • outset
  • ridge
  • hidden
  • four-sides
  • width-key-term
  • size
  • percentage
  • auto
  • size
  • auto
  • left
  • right
  • left
  • right
  • both

Color properties

Untuk color property bisa kita buat kelompok sendiri.

Background properties

Untuk background bisa berbentuk warna maupun image.

 Property Value
background
  • color
  • size
  • percentage
  • pos-key-term
  • url
  • repeat
  • repeat-x
  • repeat-y
  • no-repeat
  • fixed
  • scroll
background-color
  • color
  • none
background-image
  • url
background-repeat
  • repeat
  • repeat-x
  • repeat-y
  • no-repeat
background-attachment
  • fixed
  • scroll
background-position
  • size
  • percentage
  • pos-key-term

Classification properties

Classification properties ini sebenarnya muncul karena ada beberapa element CSS yang tidak cocok untuk dimasukkan ke dalam kelompok yang telah ada diatas. Jadi bisa dikata semua property yang belum masuk dalam kategori diatas dimasukkan ke dalam kelompok ini.

 Property Value
display
  • block
  • inline
white-space
  • nowrap
list-style
  • circle
  • square
  • disc
  • upper-alpha
  • lower-alpha
  • upper-roman
  • lower-roman
  • decimal
  • inside
  • outside
  • url
  • none
list-style-type
  • circle
  • square
  • disc
  • upper-alpha
  • lower-alpha
  • upper-roman
  • lower-roman
  • decimal
list-style-image
  • url
list-style-position
  • inside
  • outside
position
  • absolute
  • relative
z-index
  • number

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>