Cascading Style Sheet untuk tampilan text - MastahTeknik

Breaking

Minggu, 16 Desember 2018

Cascading Style Sheet untuk tampilan text

Pengaturan warna pada teks
CSS dapat terapkan untuk mengatur warna dari teks. Pengaturan warna teks dengan CSS dapat menggunakan nilai warna sebagai berikut
nilai HEX misalnya, "#ff0000"
nilai RGB misalnya, "rgb(255,0,0)"
nama dari warna tersebut misalnya "red"
Format penulisan untuk pemberian warna pada text menggunakan CSS adalah sebagai berikut:
selector {color: “value warna”;}
Pengaturan spasi antar karakter/letter spacing
Pengaturan spasi digunakan untuk mengatur jarak antar karakter pada teks. Format penulisan CSS untuk letter spacing: selector {letter spacing: “value”;}
Pengaturan bentuk bentuk teks/teks decoration 
Pengaturan teks decoration bertujuan untuk mengatur atau menghilangkan teks decoration yang ada. Format penulisan css untuk teks decoration adalah sebagai berikut:
selector {text-decoration: “value”;}
Pengaturan spasi antar kata/word spacing
Digunakan untuk mengatur jarak spasi antar kata pada HTML. Format penulisan word spacing adalah: selector {word-spacing: “value”;}
Pengaturan jarak indentasi paragraf/text indent
Text indent digunakan untuk mengatur jarak inden dari baris pertama. Format penulisan css text indent: selector {text-indent: “value”;}
Perubahan huruf besar dan huruf kecil dari sebuah teks/text-transform
Digunakan untuk mengubah huruf yang ada pada suatu kalimat, apakah terdiri dari huruf kesar semua, huruf kecil semua atau dengan huruf kapital di setiap kata. Format penulisan text transform: selector {text-transform: “value”;}
Pemberian efek bayangan pada teks/text shadow
Digunakan untuk memberikan efek bayangan pada teks. Format penulisan CSS text shadow: selector {text-shadow: “koordinat X” “koordinat Y” “warna”;}
Pengaturan text alignment
Digunakan untuk mengatur horizontal alignment pada text. Bila ingin mengatur vertical alignment maka property text-alignment diganti menjadi vertical-alignment. Format penulisan css text aligntment: selector {text-align: “value”;}

Buatlah halaman web sebagai berikut

Simpan file tersebut dengan nama color.html
Buatlah halaman web sebagai berikut
Simpan file tersebut dengan nama l-spacing.html
Buatlah halaman web sebagai berikut
Simpan file tersebut dengan nama decor.html
Buatlah halaman web sebagai berikut
Simpan dengan nama w-spacing.html
Buatlah halaman web sebagai berikut
Simpan file tersebut dengan nama text-indent.html
Buatlah halaman web sebagai berikut
Simpan file tersebut dengan nama text-transform.html
Buatlah halaman web sebagai berikut
Simpan file tersebut dengan nama text-shadow.html
Buatlah halaman web sebagai berikut
Simpan dengan nama text-alignment.html

Tidak ada komentar:

Posting Komentar

Post Top Ad

Responsive Ads Here