8 Pengaturan CSS Pada Style Teks

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

Share this post