Pandhuan kanggo Format Teks ing CSS

Nalika ngrancang situs web, format teks minangka aspek penting kanggo nggawe antarmuka sing menarik lan bisa diwaca.

CSS nyedhiyakake sawetara properti sing ngidini sampeyan ngatur macem-macem unsur teks, kalebu warna font, ukuran, kulawarga, keselarasan, spasi, lan liya-liyane.

Ing ngisor iki minangka pandhuan rinci babagan saben properti format teks, bebarengan karo conto kanggo saben properti.

 

Warna Font

Parameter: Nilai werna, sing bisa dadi jeneng werna(contone, red), kode hex(contone, "#FF0000"), nilai RGB(contone, "rgb(255, 0, 0)"), utawa nilai RGBA(contone, "rgba(255, 0, 0, 0.5)").

p {  
  color: blue;  
}  

 

Gedene tulisan

Parameter: Nilai ukuran, sing bisa dadi piksel(contone, "16px"), unit em(contone, "1em"), unit rem(contone, "1.2rem"), unit jembar viewport(contone, "10vw"), unit dhuwur viewport(contone, "5vh"), utawa unit liyane.

h1 {  
  font-size: 24px;  
}  

 

Kulawarga Font

Parameter: Dhaptar kulawarga font, sing ditemtokake ing urutan sing disenengi. Sampeyan bisa nemtokake jeneng font(contone, Arial) utawa nyakup jeneng font sing ngemot karakter khusus ing tanda kutip dobel(contone, " Times New Roman).

body {  
  font-family: Arial, sans-serif;  
}  

 

Bobot lan Gaya Font

Parameter font-weight: normal(default), bold, bolder, lighter, utawa angka angka saka 100 nganti 900.

Paramèter font-style: normal(default), italic.

em {  
  font-style: italic;  
}  
  
strong {  
  font-weight: bold;  
}  

 

Dekorasi Teks

Parameter: "none"(default), "underline", "overline", "line-through"  utawa kombinasi nilai sing dipisahake dening spasi.

a {  
  text-decoration: underline;  
}  
  
del {  
  text-decoration: line-through;  
}  

 

Alignment teks

Parameter: "left"(default), "right", "center" or "justify".

p {  
  text-align: center;  
}  

 

Line Dhuwur lan Margins

Dhuwur baris parameter: Nilai angka utawa persentase ukuran font saiki.

Margin parameter: Nilai pangukuran, kayata piksel(px), unit em(em), unit rem(rem), lsp.

p {  
  line-height: 1.5;  
  margin-bottom: 10px;  
}  

 

Tata Letak Teks Multikolom

Parameter: Integer positif utawa "auto"(default).

.container {  
  column-count: 2;  
}  

 

Owah-owahan Warna Teks ing Hover

Ora ana parameter tartamtu, mung nggunakake kelas pseudo :hover.

a:hover {  
  color: red;  
}  

 

Ganti Warna Teks ing Status(aktif, dibukak)

Ora ana parameter tartamtu, mung nggunakake pseudo-kelas :active  lan :visited.

a:visited {  
  color: purple;  
}  

 

Muga-muga panjelasan lan conto ing ndhuwur wis mbantu sampeyan ngerti carane nggunakake lan ngatur properti format teks ing CSS kanggo nggawe antarmuka teks sing apik lan menarik ing situs web sampeyan.