Selasa, 10 Januari 2017

Belajar CSS : CSS Text

Hallo teman-teman semua, nah pada kesempatan kali ini say akan memposting materi tentang CSS Text. Berikut materinya

CSS TEXT
Text Color, properti color digunakan untuk mengatur warna pada teks. Untuk menentukan warna yang paling sering ditentukan adalah nama warna, hex, rgb.
Contoh penerapannya :


Hasil dari contoh script diatas :






Text Alignment, properti text-align digunakan untuk mengatur alignment horizontal teks. Sebuah teks dapat diatur secara sejajar kanan (right), kiri (left), terpusat (center).
Contoh penerapannya :


Hasil dari contoh script diatas :


Text Decoration, properti text-decoration digunakan untuk mengatur atau menghapus dekorasi dari suatu teks. Yang paling sering digunakan untuk menghilangkan garis bawah pada link menggunakan properti text-decoration: none;
Contoh :


Hasilnya :
Text Transformation, properti text-transform digunakan untuk menentukan heruf besar dan huruf kecil pada teks. Dalam hal ini digunakan untuk mengubah segalanya menjadi huruf kecil atau besar, atau huruf pertama pada setiap kata.
Contoh :


Hasilnya :


Text Indentation, properti text-indent ini digunakan untuk menentukan indentasi dari baris pertama di teks.
Contoh :


Hasilnya :

Letter Spacing, properti letter-spacing ini digunakn untuk menentukan ruang antar karakter dalam teks.
Contoh dibawah ini menunjukan untuk menambahkan atau mengurangi ruang dalam karakter :


Hasilnya :


Line Height, properti line-height ini digunakan untuk menentukan ruang antara garis.
Contoh penerapannya :


Hasilnya :


Word Spacing, properti word-spacing ini digunakan untuk menentukan ruang antara kata dalam sebuah teks.
Contoh penerapanya :


Hasilnya :


Text DIrection, properti direction ini digunakan untuk mengubah arah pada teks.
Contoh penerapanya :

Hasilnya :


Text Shadow, properti text-shadow ini digunakan untuk menambahkan bayangan pada teks.
Contoh penerapannya :



Hasilnya :



Referensi :
http://www.w3schools.com/css/css_text.asp

Sekian dan terimakasih semoga bermanfaat
Silahkan dicoba..

0 komentar:

Posting Komentar