Lesson 6 Level 12 – Code.org

A. Changing The Font

Adalah mengubah jenis teks. Cara melakukannya,

1. Ketik “font-family” di bagian teks yang ingin diubah. (contoh: h1, h2, atau p)
2. Disamping font-family, tambahkan titik 2 (:) lalu jenis teksnya. (contoh: sans-serif, monospace, cursive)
3. Tambahkan titik koma (;) diakhir kalimat.

Dan hasil akan jadi seperti ini.

B. Underlining

Adalah memberi garis horizontal dibawah teks, biasanya untuk meng-highlight suatu teks.

Sebetulnya ada 3 jenis garis di bagian underlining ini.

Pertama: Underline (garis di bawah teks),
Kedua: Overline (garis di atas teks),
Ketiga: Line Through (garis ditengah-tengah teks).

Ada juga opsi untuk menambah jumlah garis. tinggal ditambah double atau triple.
Ada single (contoh: overline), double (contoh: overline double), dan triple (contoh: overline triple)

Cara melakukannya,

1. Ketik “text-decoration” di bagian teks yang ingin diberikan garis. (contoh: h1, h2, atau p)
2. Disamping “text-decoration”, Berikan titik dua (:), lalu ketik opsi garis yang diinginkan. (contoh: overline, underline)
3. Tambahkan titik koma. (;)

Dan hasil akan jadi seperti ini.

C. Text Alignment

Adalah tata letak suatu teks di halaman. Text Alignment terbagi menjadi 3.

1. Center (Teks berada di tengah-tengah halaman)
2. Right (Teks berada di bagian kanan halaman)
3. Left (Teks berada di bagian kiri halaman)

Cara melakukannya:

1. Ketik “text-align” di bagian teks yang ingin diubah posisinya. (contoh: h1, h2, atau p)
2. Disamping “text-align”, Berikan titik dua (:), lalu ketik opsi garis yang diinginkan. (contoh: right, left)
3. Tambahkan titik koma. (;)

Dan hasil akan jadi seperti ini.

D. Letter Spacing

Adalah jarak setiap baris di halaman. bisa diatur jauh, bisa diatur dekat. Semakin tinggi pixel, akan semakin jauh jaraknya. and vice versa.

Cara melakukannya:

1. Ketik “letter-spacing” di bagian teks yang ingin diberi jarak tiap barisnya. (contoh: h1, h2, atau p)
2. Disamping “letter-spacing”, Berikan titik dua (:), lalu tentukan jarak tiap baris yang diinginkan. (contoh: 5px, 12px, 9px)
3. Tambahkan titik koma. (;)

Dan hasil akan jadi seperti ini.

E. Text Shadow

Adalah bayangan di teks. yang membantu memperjelas teks dan membuat warnanya semakin kontras dengan background.

Cara melakukannya:

1. Ketik “text-shadow” di bagian teks yang ingin diberi bayangan. (contoh: h1, h2, atau p)
2. Disamping “text-shadow”, Berikan titik dua (:), lalu tentukan jarak bayangan dari teks dan posisinya. (contoh: 2px, -2px)
3. Tentukan warna bayangan yang diinginkan (contoh: pink)
4. Tambahkan titik koma. (;)

Dan hasilnya akan jadi seperti ini.

Dan inilah panduan untuk mengerjakan lesson 6, level 12. Dari Bagian A sampai E.

sekian, Terima Kasih. cya!