Skip to main content

Belajar Css Font Style Tahap Dasar - Tutorial Blog

 atau Css merupakan salah satu dari bahasa pemrograman yang bertujuan untuk mengatur sebua Belajar CSS Font Style Tahap Dasar - Tutorial Blog
Belajar CSS Font Style Tahap Dasar - Tutorial Blog
Cascading Style Sheet atau Css merupakan salah satu dari bahasa pemrograman yang bertujuan untuk mengatur sebuah tampilan atau layout menyerupai website contoh-nya. Dalam dunia website (blogger) css telah mengambil banyak peranan penting yang bertujuan untuk memudahkan pengguna menyerupai pengelola website. Nah, kali ini aku akan menulis turial dasar perihal cara mengatur style font (huruf) pada situs blog dari dasar-dasar metode penggunaan css.

Sebelum-nya aku juga telah menulis tutorial cara menginstall google font kedalam template dan cara penggunaan nya. jikalau sahabat ingin menginstall google font untuk situs blog kamu, silahkan baca disini. Baiklah kembali ke topik pembahasan yaitu Belajar CSS Font Style Tahap Dasar.

CSS telah menyediakan property text-transform yang berfungsi sebagai pengubah tampilan teks menjadi abjad besar semua (uppercase) atau menjadi abjad kecil semua (lowercase) dan menciptakan abjad besar atau kapital (capitalize) di awal kalimat.

Apa penting-nya css font syle (font-variant)

Fungsi yang paling menonjol font-variant yaitu untuk menghindari kesalahan pada ketika menulis/mengetik, terkadang kita lupa menciptakan abjad besar atau kelalaian lainnya dalam menulis, aku sendiri memakai property text-transform pada situs ini yang aku khusus-kan pada bab topmenu, menu, dan widget tittle semoga selalu menampilkan abjad besar. Makara meskipun aku menulis sajian dengan abjad acak (besar-kecil) property text-transform tetap menampilkan-nya dengan abjad besar (kapital).

Cara Membuat Huruf Menjadi Kapital Semua Dengan Css

Tambahkan properti {text-transform:uppercase;} pada id element situs, sebagai pola penerapan properti {text-transform:uppercase;} yaitu sebagai berikut.

h2{text-transform:uppercase;} maka setiap element yang di beri tag h2 akan menempilkan abjad kapital (huruf besar semua) atau kau juga dapat menerapkan pada element individu yaitu menyerupai ini .id_element_kamu{text-transform:uppercase;}. Contoh penerapan pada situs aku adalah:

#top-menu{text-transform:uppercase;font-size:11px;}

Css text-transform:uppercase; memerintahkan untuk selalu menampilkan abjad kapital (besar) pada bab sajian atas dengan size (tinggi/besar) abjad yaitu 11px.

Cara Membuat Huruf Kecil Dengan Css Font Style

Kebalikan dari pola diatas, untuk menampilkan abjad kecil semua pada sebuah element maka kita cukup dengan menambahkan properti {text-transform:lowercase;}. tapi aku tidak tau penulisan dengan style abjad kecil semua sempurna nya untuk di bab apa, mungkin kau punya ide.

Membuat abjad besar di awal kalimat dengan css

Yang satu ini cocok di terapkan pada laman artikel web, untuk menimbulkan setiap paragraf di awali dengan abjad besar. Cara penerapan nya yaitu menyerupai berikut ini.

p {text-transform:capitalize;} jikalau kau ingin menambahkan property size (settingan besar huruf) tambahkan juga font-size:nilai_pixel; sehingga menjadi p{text-transform:capitalize;font-size:16px;}. jikalau property css font style tersebut bersebrangan dengan style css laman web kamu, maka kita dapat menambahkan property "!important;" untuk menggunggulkan-nya, contoh: p{text-transform:capitalize;font-size:16px!important;} abjad "p" yaitu "id element" laman yang berarti "paragraf". jikalau kau ingin menambahkan nya pada element selain paragraf maka setiap element selalu di awalai dengan tanda titik atau pagar, contoh:
.menu{text-transform:capitalize;font-size:16px;} or #menu{text-transform:capitalize;font-size:16px;}
Jika ingin menambahkan text-transform pada beberapa element maka cara penerapan nya yaitu menyerupai pola berikut ini:
.menu,.sub-menu,.post-tittle,widget-tittle{text-transform:capitalize;font-size:16px;}
Untuk mengetahui id element situs kita dapat melaksanakan inspect element pada setiap bab potongan situs, aku haraf kau sudah mengerti perihal inspect element.

Nah, yang terakhir untuk menghilangkan semua dampak css diatas cukup dengan menambahkan property "none" atau {text-transform:none;} dengan demikian semua dampak font style akan hilang dan akan menampilkan apa adanya (seperti yang kau tulis) saja. Demikian saja klarifikasi perihal css font style (font-variant) dan silahkan di coba dan beri komentari perihal post ini.

Comments

Popular posts from this blog

Cara Melihat Jumlah Followers Blog Sendiri

Cara Melihat Jumlah Followers Blog Sendiri - Situs blog yang terkenal tentu sudah memiki jumlah followers (pengikut) situs yang cukup banyak, ratusan atau mungkin ribuan followers. Taukah kau followers situs blogger yang gotong royong yaitu followers yang di sanggup dari feedburner atau lebih dikenal dengan istilah Follow by E-mail atau RSS Feed . Pertanyaan nya berapakah jumlah followers atau pengikut situs blog anda ketika ini? Untuk mengetahui nya mari kita simak cara melihat jumlah followers situs blogger yang diperoleh dari feedburner google (widget follow by e-mail) berikut ini; Cara Mengetahui Jumlah Pengikut RSS Feed Pertama Login ke Akun G-mail, kemudian Kunjungi laman Dashboard Feedburner Anda akan diarahkan ke dashboard RSS Feed (Laman kawasan melihat statistik dan jumlah followers situs blog) Seperti yang ditunjukkan pada pola berikut ini. Cara melihat atau mengetahui jumlah followers blog Keterangan : Gambar sebelah kiri mengatakan daftar feedburner s...

Rangkaian Lampu Tl Double 1 Ballas

Rangkaian Lampu TL Double 1 Ballas - Pada artikel sebelum nya saya telah membahas wacana cara memasang Single lampu TL (Tube Lamp) dengan Single Ballas . Bagi kau yang ingin mengetahui lebih jauh wacana lampu TL silahkan baca artikel sebelum ny alasannya pada kesempatan kali ini saya hanya akan membuatkan diagram rangkaian lampu TL double 1 ballas dengan tata letak komponen lampu tl yang lebih gampang untuk dipahami. Sebenar-nya di luar sana ada aneka macam tutorial yang menjelaskan wacana " Rangkaian Lampu TL Double 1 Ballas ( 2 lampu TL 1 Ballas ) " ibarat ini. Namun kebanyakan dari mereka menampilkan diagram rangkaian lampu tl yang kurang baik dari segi penataan gambar komponen lampu TL sehingga sedikit sulit di pahami. Sebelum menuju ke rangkaian lampu tl double 1 ballas dan cara merakit lampu tl double sebaik nya persiapkan material "komponen" lampu tl nya terlebih dahulu ibarat tertera di bawah ini: Casing " Double Tube Lamp " atau casing untu...

Cara Memakai Google Drive (Gdrive)

Cara Menggunakan Google Drive - Google drive atau gdrive ialah media penyimpanan online yang disediakan oleh google secara geratis. Fungsi dan cara kerja gdrive sama hal nya dengan memori card yakni merupakan kawasan penyimpanan file. Namun perbedaan nya ialah gdrive atau google drive hanya sanggup diakses melalu internet (secara online), Google derive juga dikenal dengan sebutan cloud (penyimpanan online) sama menyerupai cloud pada account iphone atau xiaomi yang menyediakan media penyimpanan online. Pagi ini admind akan menyebarkan cara memakai google drive "gdrive" secara lengkap biar masing-masing kita sanggup mengenal grive lebih dalam lagi dan sanggup memanfaatkan kemudahan google yang penuh manfaat ini " gdrive ". Apa saja yang sanggup disimpan di grive? G-drive atau google drive sanggup menyimpan banyak jenis file dan bisa menyimpan file dengan jumlah yang banyak, adapun jenis-jenis file yang sanggup disimpan di gdrive adalah: Foto (JPEG, PNG, G...