Tuesday, 27 September 2011

value di CSS

| Tuesday, 27 September 2011 | 0 comments


Predefined Value

Predefined  value  merupakan  nilai  yang  sudah  terdefinisikan  oleh  (X)HTML.  Nilai  ini
dapat  dipilih  dari  beberapa  alternatif  pilihan  yang  ada.  Contoh  penggunaan  predefined
value ini adalah pada style berikut

h1 {
font-style : italic;
   }

Style di atas digunakan untuk membuat text miring pada elemen heading 1. Dalam hal ini
value  ‘italic’  merupakan  predefined  value.  Untuk  properti  font-style  terdapat  pilihan
value  yang  telah  didefinisikan  oleh  (X)HTML  yaitu  italic,  normal,  dan  oblique.
Perhatikan bahwa predefined value ditulis tanpa diapit tanda petik.


Bilangan

Suatu  value  dapat  pula  berupa  bilangan  tertentu  (tanpa  satuan  apapun).  Berikut  ini
contohnya:

p  {
line-height : 2;
   }

Maksud  style  di  atas  adalah  mengatur  jarak  antar  baris  paragraf  menjadi  2  kali  dari
ukuran fontnya.


Panjang, Besar dan Prosentase

Untuk menyatakan panjang, besar dan prosentase, value harus diberikan satuan seperti px
(pixel), in (inch), cm (centimeter), mm (milimeter), pt (points) dan pc (picas). Berikut ini
beberapa contohnya 

h1  {


font-size : 20px;  /* membuat ukuran font 20 pixel */
    }

hr  {
width : 20%;  

      /* membuat garis horizontal dengan panjang 20% terhadap lebar 
         jendela browser /*
    }




URL

Sebuah value juga dapat berupa URL. Berikut ini contohnya

body
{
  background : url(img/image.jpg);
}

Style di atas untuk memberi background image pada body  yang diambil dari folder img
dengan nama file image.jpg.


Warna

Untuk  memberi  value  berupa  warna  pada  properti,  ada  beberapa  cara  yang  dapat
dilakukan  yaitu  dengan  menuliskan  secara  eksplisit  warna  yang  diinginkan,  misal  (red,
green,  yellow,  dll)  atau  dengan  menuliskannya  dalam  kode  hexadesimal.  Berikut  ini
contohnya

p
  {
    color : red;
  }

p
  {
    color : #FF0000;  /* identik dengan warna merah (hexadesimal)
  }

0 comments:

:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))

Post a Comment

 
Copyright 2011. w3-id.blogspot.com. | Template by o-om.com - zoomtemplate.com