yazı tipi ağırlığı CSS'deki özellik, yazı tipinin ağırlığını veya kalınlığını ayarlamak için kullanılır. Bir metindeki karakterlerin ne kadar ince veya kalın olduğunu belirtir. yazı tipi ağırlığı özelliği, tarayıcı tarafından belirtilen ağırlıklara veya bir yazı tipi ailesindeki mevcut yazı tipi yüzlerine bağlıdır. Bu CSS özelliği, ince ve kalın karakterleri tanımlar.

Önceden tanımlanmış sayısal değeri veya anahtar kelime değerlerini kabul eder. Bu özellik ile kullanabileceğimiz mevcut anahtar kelimeler şunlardır: normal, kalın, daha hafif ve daha kalın . Sayısal değer 100, 200, 300, ........., 900'e kadar olabilir. Daha yüksek sayısal değer, daha düşük sayısal değerlerden daha kalın yazı tipi ağırlığını temsil eder.

Sözdizimi

 font-weight: normal | bold | bolder | lighter | number | initial | inherit; 

sayı yukarıdaki sözdiziminde sayısal değerleri temsil eder. Sayısal değer 400 anahtar kelime değeriyle aynı normal ve değer 700 anahtar kelime değeriyle aynı gözü pek .

normal Strong> değeri normal karakterleri tanımlar ve gözü pek değer kalın karakterleri belirtir. daha cesur değer daha kalın yazı tipi ağırlığını temsil eder ve çakmak değer, üst öğeden miras alınan ağırlıktan daha hafif yazı tipi ağırlığını temsil eder.

Bir illüstrasyon kullanarak CSS'de metnin nasıl kalınlaştırılacağını görelim.

giriiş

CSS, web sayfasının geliştirilmesi için güçlü bir araç olarak bilinir. Bunun yardımıyla HTML içeriğini pek çok şekilde biçimlendirebiliriz. Web sayfasını şekillendirmenin en yaygın özelliklerinden biri yazı tipi ağırlığı özelliğinin yardımını kullanmaktır. Kalın metinlerin yardımıyla önemli bilgileri ve görsel kontrastı vurgulayabiliriz ve bu aynı zamanda içeriğin okunabilirliğini de artırır.

youtube'u indirmek için vlc

Yazı Tipi Ağırlığı Özelliğini Anlamak

CSS'de yazı tipinin ağırlığını veya kalınlığını tanımlamak için kullanılan Font-Weight özelliği vardır. Ayrıca, daha kalın bir yazı tipi ağırlığını belirten daha yüksek değeri kabul ederek, metnin kalınlığı veya açıklığı derecesini de belirler. Font-weight özelliği sayısal ve anahtar kelime değerleri gibi çeşitli değerleri kabul eder.

Sayısal değerlerin aralığı 100 ile 900 arasındadır ve 100'lük artışlarla sağlanır. Örneğin, yazı tipi ağırlığı değerini 400 olarak alırsak bu normaldir, 700 yazı ağırlığı değeri ise kalın olarak kabul edilir. Kalın, daha kalın, daha hafif ve Yaygın olarak kullanılan bazı anahtar kelime değerleri.

CSS ile Kalın Metin Nasıl Oluşturulur

HTML'de kalın metni CSS yardımıyla oluşturabiliriz. Satır içi, dahili veya harici yazı tipi stili özelliklerini kullanabiliriz.

1. Satır İçi Stil ile Kalın Metni Nasıl Oluşturabiliriz?

Satır içi stilin yardımıyla font-weight özelliğini doğrudan belirli bir HTML öğesine kullanabiliriz. Bir örnek verelim.

HTML Kodu:

 Document <p>Welcome to javaTpoint</p> <p>This is a bold text</p> 

Çıktı

Açıklama:

int'yi c++ dizisine dönüştür

Yukarıdaki kodda satır içi CSS kullandık ve font-weight özelliğini kalın olarak uyguladık.

2. İç Stil ile Kalın Metinleri Nasıl Oluşturabiliriz?

Burada CSS özelliğini head etiketinin içerisine style etiketi ile yazmamız gerekiyor. Bir örnek verelim:

HTML Kodu:

 Document p { font-weight: bold; } <p>Welcome to javaTpoint</p> <p>This is a bold text</p> 

Çıktı

Açıklama:

Yukarıdaki kodda dahili CSS kullandık ve font-weight özelliğini uyguladık.

3. Dış Stil ile Kalın Metinleri Nasıl Oluşturabiliriz?

Burada harici bir CSS dosyası oluşturup onu HTML dosyasına bağlamamız gerekiyor. Bu CSS dosyasının içine style özelliğini yazmamız gerekiyor. Bir örnek ele alalım.

java dize birleştirme

HTML Kodu:

 Document <p>Welcome to javaTpoint</p> <p>This is a bold text</p> 

CSS kodu:

 p { font-weight: bold; } 

Çıktı

Açıklama:

Yukarıdaki kodda harici CSS özelliğini kullandık ve font-weight özelliğini uyguladık.

Örnek

Aşağıdaki örneği kullanarak farklı tonlarda kalın metinlerin nasıl oluşturulacağını görelim:

 p{ font-size: 20px; } <p>This font is normal.</p> <p>This font is bold.</p> <p>This font is lighter.</p> <p>This font is bolder.</p> <p>This font is 100 weight.</p> <p>This font is 200 weight.</p> <p>This font is 300 weight.</p> <p>This font is 400 weight.</p> <p>This font is 500 weight.</p> <p>This font is 600 weight.</p> <p>This font is 700 weight.</p> <p>This font is 800 weight.</p> <p>This font is 900 weight.</p> 

Çıktı