Tunggu Sebentar...

8/02/2017

8 Pengaturan CSS Pada Style Teks

Baca Juga



AA Sciences, CSS, Style Pada Teks, 8 Penggunaan CSS Pada Style Teks, 8 Pengaturan CSS Pada Style Teks
 - Alhamdulillah sebelumnya kalian terutama sobat AA Sciences telah mengetahui tentunya yakni Anatomi dan Cara Kerja Cascading Style Sheet. Lalu kembali lagi Alhamdulillah AA Sciences akan membagikan sedikit ilmu yang mana kalian akan di bimbing pembelajaran dari style pada teks/script yang mana di dalam nya fitur dari CSS akan bertanggung jawab penuh.

Tentunya jika kalian terutama sobat AA Sciences ingin memahami pengetahuan terkait style pada teks, berikut AA Sciences akan berbaginya.

Pada umumnya agar hendak membuat website yang ingin tampil terlihat lebih menarik, mudah mengubah mengubah tampilan website, tentunya kinerja tersebut harus didasarkan pada pemahaman CSS nya terlebih dahulu dalam kemasan CSS.

Dalam pengaturan style teks tersebut umumnya meliputi beragam rangkaian property, diantaranya yakni perwarnaan, spasi, jenis font, style font, color font, dan hal lain sebagainya yang tentunya dapat dikondisikan dalam kemasan CSS.

Agar kalian ingin mengetahui nya lebih detail disini AA Sciences akan menjelaskan dari properti dan keterangan nya dari kemasan CSS dalam bentuk tabel, berikut di bawah ini.

Agar kalian ingin mengetahui nya lebih detail disini AA Sciences akan menjelaskan dari properti dan keterangan nya dari kemasan CSS dalam bentuk tabel, berikut di bawah ini.


Properti Keterangan
Color  Mengatur Warna pada teks/script yang hendak dituju.
Direction  Menentukan arah ingin ditentukannya dalam tulisan/teks/script terkait.
Letter-spacing Menambah atau mengurangi property dari spasi antar karakter dalam suatu teks.
Line-height Mengatur tinggi barisnya suatu teks.
Text-align Bertugas memberi rata atau batas teks secara horizontal.
Text-decoration Menentukan hiasan/dekorasi pada teks.
Text-indent Bertugas mengatur jarak inden dalam baris pertama dalam teks-blok.
Text-shadow Bertugas menentukan efek dari bayangan pada suatu teks.
Text-transform Bertugas mengatur dari teks kecil hingga besar.
Unicode-bidi  Bertugas mengeset unicode.
Vertical-align Mengatur dari batas teks secara horizontal.
White-space Mengatur dari penulisan white-space pada suatu element.
Word-spacing Menambahkan atau mengurangi spasi antar kata-kata dalam suatu teks.

Agar kalian ingin mengetahui nya lebih detail disini AA Sciences akan menjelaskan dari properti dan keterangan nya dari kemasan CSS dalam bentuk tabel, berikut di bawah ini.

Agar kalian ingin mengetahui nya lebih detail disini AA Sciences akan menjelaskan dari properti dan keterangan nya dari kemasan CSS dalam bentuk tabel, berikut di bawah ini.


Properti Keterangan
Color  Mengatur Warna pada teks/script yang hendak dituju.
Direction  Menentukan arah ingin ditentukannya dalam tulisan/teks/script terkait.
Letter-spacing Menambah atau mengurangi property dari spasi antar karakter dalam suatu teks.
Line-height Mengatur tinggi barisnya suatu teks.
Text-align Bertugas memberi rata atau batas teks secara horizontal.
Text-decoration Menentukan hiasan/dekorasi pada teks.
Text-indent Bertugas mengatur jarak inden dalam baris pertama dalam teks-blok.
Text-shadow Bertugas menentukan efek dari bayangan pada suatu teks.
Text-transform Bertugas mengatur dari teks kecil hingga besar.
Unicode-bidi  Bertugas mengeset unicode.
Vertical-align Mengatur dari batas teks secara horizontal.
White-space Mengatur dari penulisan white-space pada suatu element.
Word-spacing Menambahkan atau mengurangi spasi antar kata-kata dalam suatu teks.


Berikut 8 Pengaturan Style pada teks dalam dokumen CSS :


1. Pengaturan Color/Warna Pada Teks


Dalam dokumen CSS tentunya dapat menerapkan dalam mengatur warna/color dalam suatu teks/script. Pengaturan warna dalam teks dengan CSS bisa dimulai dengan menggunakan beberapa nilai jenis warna dimana tercakup 3 jenis penerapan nya, seperti berikut.

- Nilai HEX -> Contoh, "#30cc91"
- Nilai RGB -> Contoh, "rgb(251,55)"
- Nilai WARNA LIVE/LANGSUNG -> Contoh, "blue/red/black/white"

Format dalam penulisan untuk pemberian warna pada teks tersebut, didefinisikan menggunakan CSS seperti contoh berikut:

Selector {color:nilai warna diletakan disini"}

atau agar lebih jelas lagi contoh penerapan nya sebagai berikut untuk 3 jenis style diatas tadi:

- .kotak {color:"#30cc91"}
- .kotak {color:"rgb(250,55)"}
- .kotak {color:"pink"}

2. Pengaturan Spasi Word Letter Spacing/Antar Karakter


Salah satu definisi gaya dari style CSS yakni komponen letter-spacing nya, yang mana letter-spacing berfungsi sebagai alat yang dipergunakan untuk memberikan suatu jarak (spasi) dalam karakter atau huruf terkait.

Pada umumnya format dari penulisan CSS untuk memberi settingan jarak (spasi) antar karakternya atau hurufnya adalah seperti berikut ini :

Selector: {letter-spacing: nilai spasi;}

atau agar lebih jelas lagi contoh penerapan nya sebagai berikut untuk penerapan dari letter-spacing nya :

selector: {letter-spacing: 12px;}

3. Pengaturan Bentuk-bentuk dalam Teks Decoration/Dekorasi


Pengaturan dalam bentuk teks yang menggunakan property teks dekorasi atau text-decoration bertujuan untuk membatu mengatur atau menghapusnya suatu dekorasi dalam suatu teks.

Format penerapan dari dekorasi teks atau text-decoration pada umumnya adalah seperti berikut :

selector {text-decoration: nilai text-decoration}

atau agar lebih jelas lagi contoh penerapan nya sebagai berikut untuk penerapan dari text-decoration nya :

.kotak {text-decoration: 20px text-decoration}

4. Pengaturan Spasi Word Spacing/Antar Kata


Salah satu style pada CSS yakni adalah word-spacing yang mana umum dipergunakan dalam rangka memberikan spasi (jarak) pada beberapa kata-kata atau huruf.

Format penerapan dari antar kata atau word spacing pada umumnya adalah seperti berikut :

selector: {word-spacing: nilai spasi;}

atau agar lebih jelas lagi contoh penerapan nya sebagai berikut untuk penerapan dari word spacing nya :

selector: {word-spacing: 20px spasi;}

5. Pengaturan Jarak Text Indent/Indentasi Paragraf


Text-indent bertugas sebagai alat yang mengatur dari segi jarak indent dari baris awal dalam suatu teks blok, sehingga teks pada baris-baris awal itu nampak terlihat lebih menjorok ke dalam, dibandingkan teks baris yang lainnya.

Format penerapan dari Indentasi Paragraf atau Text Indent pada umumnya adalah seperti berikut :

selector: {text-indent: nilai indent}

Format penerapan dari Indentasi Paragraf atau Text Indent pada umumnya adalah seperti berikut :

.kotak: {text-indent: 20px indent}

6. Pengaturan dari Huruf Besar dan Huruf Kecil dalam Sebuah Teks Transfrom/Text Transform


Teks Transform atau Text Transform bertugas sebagai alat yang dipergunakan untuk menentukan suatu huruf baik itu besar dan huruf yang kecil dala suatu teks/text.

Format penerapan dari Teks Transfrom atau Text Transform pada umumnya adalah seperti berikut :

selector: {text-transform: nilai text-transform}

atau agar lebih jelas lagi contoh penerapan nya sebagai berikut untuk penerapan dari Teks Transfrom atau Text Transform nya:

selector: {text-transform: 20px text-transform}

7. Pengaturan Efek Bayangan/Shadow dalam Text Bayangan/Shadow


Teks bayangan atau Text Shadow berfungsi sebagai alat yang dipergunakan untuk memberikan suatu bayangan pada sebuah teks.

Format penerapan dari Efek Bayangan atau Text Bayangan pada umumnya adalah seperti berikut :

selector {text-shadow: koordinatx koordinatY nilaiwarnateksbayangandisini;}

atau agar lebih jelas lagi contoh penerapan nya sebagai berikut untuk penerapan dari Text Bayangan :

selector {text-shadow: koordinatx koordinatY #30cc91;}

8. Pengaturan Teks Rata/Text Alignment


Dan yang terakhir yakni text-alignment, property dari text-align ini berfungsi sebagai alat yang mengatur dari jenis rata pada suatu teks terutama teks bertype horizontal.

Teks rata dianataranya dapat ditulis seperti rata kanan, rata kiri, rata tengah, rata sejajar, dan bahkan rata kanan kiri seklaipun.

Format penerapan dari Teks Rata/Text Alignment pada umumnya adalah seperti berikut :

selector {text-align: nilai text-align;}

atau agar lebih jelas lagi contoh penerapan nya sebagai berikut untuk penerapan dari Teks Rata/Text Alignment :

.kotak {text-align: 20px text-align;}

Tag :

CSS, Style CSS, Style Pada Teks, Style Pada CSS, Gaya CSS, Gaya Teks, Style Pada Teks, Style Pada CSS, Style Teks, Style CSS, pengaturan teks gaya style, penggunaan style teks, penggunaan style teks css, 8 pengaturan CSS, 8 Penggunaan css, kegunaan css

Artikel Terkait

Seorang Pelajar yang Ingin Berbagi Ilmu Pengalaman yang diketahui nya kepada seluruh Umat Manusia, dan Semoga Ilmu yang ia bagikan tersebut bermanfaat. Amin

================================================================
~ Jika ingin men Copy Paste harap masuk kan sumber link artikel saya di postingan sobat
~Dilarang Berkomentar link aktif , jika ada yang memasuk kan link aktif maka kami akan Hapus dan kami anggap Spam
~ Komentar lah dengan Bahasa yang Baik dan Relevan dengan sesuai artikel terkait tersebut . Terimakasih
================================================================
EmoticonEmoticon