SlideShare a Scribd company logo
1 of 2
Download to read offline
CSS Tutorial rosihanari.net
Lebih Lanjut Tentang Value 14
Lebih Lanjut Tentang Value
Pada bab ini akan dijelaskan lebih lanjut tentang aturan penulisan value dari properti
yang diberikan.
Terdapat beberapa jenis value yang dapat berikan pada properti style, antara lain berupa
predefined value, bilangan, prosentase, url, dan juga warna.
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
CSS Tutorial rosihanari.net
Lebih Lanjut Tentang Value 15
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)
}

More Related Content

Viewers also liked

Campaña desayuno saludable de milkaut
Campaña desayuno saludable de milkautCampaña desayuno saludable de milkaut
Campaña desayuno saludable de milkautnairachaile
 
Results of survey for energy-Denmark
Results of survey for energy-DenmarkResults of survey for energy-Denmark
Results of survey for energy-DenmarkEleni Kabaraki
 
Crear hoy las escuelas de mañana
Crear hoy las escuelas de mañanaCrear hoy las escuelas de mañana
Crear hoy las escuelas de mañanacocolisaz2011
 
Carta comercial
Carta comercialCarta comercial
Carta comercialDiego
 
Estaciones del año
Estaciones del añoEstaciones del año
Estaciones del añoMERUIZR
 
Estudio del suelof
Estudio del suelofEstudio del suelof
Estudio del suelofMichael Mc
 
Proyecto Final Sociedad de la Información
Proyecto Final Sociedad de la InformaciónProyecto Final Sociedad de la Información
Proyecto Final Sociedad de la Informacióndc20diana
 
El espacio en el mensaje publicitario
El espacio en el mensaje publicitarioEl espacio en el mensaje publicitario
El espacio en el mensaje publicitarioajhajhajhajhajhajhajh
 
El Periodo De Entreguerras
El Periodo De EntreguerrasEl Periodo De Entreguerras
El Periodo De Entreguerrasmilvilla
 
Descripcion de Arcones,Segovia.
Descripcion de Arcones,Segovia.Descripcion de Arcones,Segovia.
Descripcion de Arcones,Segovia.maria_arribas
 
La internet del siglo 21
La internet del siglo 21La internet del siglo 21
La internet del siglo 21carlos
 
0005 taller de publicidad ii - la publicidad institucional- 0005
0005 taller de publicidad ii - la publicidad institucional- 00050005 taller de publicidad ii - la publicidad institucional- 0005
0005 taller de publicidad ii - la publicidad institucional- 0005UTP
 
Informe nº 1 tarea derecho internacional publico
Informe nº 1 tarea derecho internacional publicoInforme nº 1 tarea derecho internacional publico
Informe nº 1 tarea derecho internacional publicoLuciana Alva Zavaleta
 
Medidas de tendencia central y dispersión
Medidas de tendencia central y dispersiónMedidas de tendencia central y dispersión
Medidas de tendencia central y dispersiónYeltzin Garcia
 
Comprobantes de contabilidad
Comprobantes de contabilidadComprobantes de contabilidad
Comprobantes de contabilidadsimoncorreasj
 
Wedding & Travel
Wedding & TravelWedding & Travel
Wedding & Travelandrea claire
 

Viewers also liked (20)

Campaña desayuno saludable de milkaut
Campaña desayuno saludable de milkautCampaña desayuno saludable de milkaut
Campaña desayuno saludable de milkaut
 
Results of survey for energy-Denmark
Results of survey for energy-DenmarkResults of survey for energy-Denmark
Results of survey for energy-Denmark
 
Crear hoy las escuelas de mañana
Crear hoy las escuelas de mañanaCrear hoy las escuelas de mañana
Crear hoy las escuelas de mañana
 
Carta comercial
Carta comercialCarta comercial
Carta comercial
 
Estaciones del año
Estaciones del añoEstaciones del año
Estaciones del año
 
Estudio del suelof
Estudio del suelofEstudio del suelof
Estudio del suelof
 
Examen final
Examen finalExamen final
Examen final
 
Proyecto Final Sociedad de la Información
Proyecto Final Sociedad de la InformaciónProyecto Final Sociedad de la Información
Proyecto Final Sociedad de la Información
 
El espacio en el mensaje publicitario
El espacio en el mensaje publicitarioEl espacio en el mensaje publicitario
El espacio en el mensaje publicitario
 
El Periodo De Entreguerras
El Periodo De EntreguerrasEl Periodo De Entreguerras
El Periodo De Entreguerras
 
Solicita aclaración
Solicita aclaraciónSolicita aclaración
Solicita aclaración
 
Descripcion de Arcones,Segovia.
Descripcion de Arcones,Segovia.Descripcion de Arcones,Segovia.
Descripcion de Arcones,Segovia.
 
La internet del siglo 21
La internet del siglo 21La internet del siglo 21
La internet del siglo 21
 
Seguridad por defecto
Seguridad por defectoSeguridad por defecto
Seguridad por defecto
 
0005 taller de publicidad ii - la publicidad institucional- 0005
0005 taller de publicidad ii - la publicidad institucional- 00050005 taller de publicidad ii - la publicidad institucional- 0005
0005 taller de publicidad ii - la publicidad institucional- 0005
 
Informe nº 1 tarea derecho internacional publico
Informe nº 1 tarea derecho internacional publicoInforme nº 1 tarea derecho internacional publico
Informe nº 1 tarea derecho internacional publico
 
Medidas de tendencia central y dispersión
Medidas de tendencia central y dispersiónMedidas de tendencia central y dispersión
Medidas de tendencia central y dispersión
 
Tarea2
Tarea2Tarea2
Tarea2
 
Comprobantes de contabilidad
Comprobantes de contabilidadComprobantes de contabilidad
Comprobantes de contabilidad
 
Wedding & Travel
Wedding & TravelWedding & Travel
Wedding & Travel
 

Similar to Css tutorial-04

Tabel Tag HTML
Tabel Tag HTMLTabel Tag HTML
Tabel Tag HTMLFajar Sany
 
webdesign dasar : 03 html dan css dasar
webdesign dasar : 03 html dan css dasarwebdesign dasar : 03 html dan css dasar
webdesign dasar : 03 html dan css dasarSMK Negeri 6 Malang
 
TIPE DATA PEMROGRAMAN.pptx
TIPE DATA PEMROGRAMAN.pptxTIPE DATA PEMROGRAMAN.pptx
TIPE DATA PEMROGRAMAN.pptxssuser2693661
 
Web syahid 1210651273
Web syahid 1210651273Web syahid 1210651273
Web syahid 1210651273Moh Syahid
 
02 materi html pengolahan format font
02   materi html pengolahan format font02   materi html pengolahan format font
02 materi html pengolahan format fontDeka M Wildan
 
Laporan pemrograman berbasis web
Laporan pemrograman berbasis webLaporan pemrograman berbasis web
Laporan pemrograman berbasis webMohammad Rosidi
 
modul CSS tugas Pemrograman Berbasis Web
modul CSS tugas Pemrograman Berbasis Webmodul CSS tugas Pemrograman Berbasis Web
modul CSS tugas Pemrograman Berbasis WebSayoer Tetep Slankers
 

Similar to Css tutorial-04 (13)

Css tutorial-02
Css tutorial-02Css tutorial-02
Css tutorial-02
 
Tabel Tag HTML
Tabel Tag HTMLTabel Tag HTML
Tabel Tag HTML
 
webdesign dasar : 03 html dan css dasar
webdesign dasar : 03 html dan css dasarwebdesign dasar : 03 html dan css dasar
webdesign dasar : 03 html dan css dasar
 
webdesign dasar : 06 layout
webdesign dasar : 06 layoutwebdesign dasar : 06 layout
webdesign dasar : 06 layout
 
TIPE DATA PEMROGRAMAN.pptx
TIPE DATA PEMROGRAMAN.pptxTIPE DATA PEMROGRAMAN.pptx
TIPE DATA PEMROGRAMAN.pptx
 
Modul 2 - CSS
Modul 2 - CSSModul 2 - CSS
Modul 2 - CSS
 
CSS
CSSCSS
CSS
 
Web syahid 1210651273
Web syahid 1210651273Web syahid 1210651273
Web syahid 1210651273
 
02 materi html pengolahan format font
02   materi html pengolahan format font02   materi html pengolahan format font
02 materi html pengolahan format font
 
Laporan pemrograman berbasis web
Laporan pemrograman berbasis webLaporan pemrograman berbasis web
Laporan pemrograman berbasis web
 
Modul PDF.docx
Modul PDF.docxModul PDF.docx
Modul PDF.docx
 
modul CSS tugas Pemrograman Berbasis Web
modul CSS tugas Pemrograman Berbasis Webmodul CSS tugas Pemrograman Berbasis Web
modul CSS tugas Pemrograman Berbasis Web
 
webdesign dasar : 07 background
webdesign dasar : 07 backgroundwebdesign dasar : 07 background
webdesign dasar : 07 background
 

Css tutorial-04

  • 1. CSS Tutorial rosihanari.net Lebih Lanjut Tentang Value 14 Lebih Lanjut Tentang Value Pada bab ini akan dijelaskan lebih lanjut tentang aturan penulisan value dari properti yang diberikan. Terdapat beberapa jenis value yang dapat berikan pada properti style, antara lain berupa predefined value, bilangan, prosentase, url, dan juga warna. 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
  • 2. CSS Tutorial rosihanari.net Lebih Lanjut Tentang Value 15 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) }