The font-weight vlastnosť v CSS slúži na nastavenie hmotnosti alebo hrúbky písma. Určuje, aké tenké alebo hrubé sú znaky v texte. The font-weight vlastnosť závisí buď od váh špecifikovaných prehliadačom, alebo od dostupných plôch písma v rodine písiem. Táto vlastnosť CSS definuje tenké až hrubé znaky.

Prijíma preddefinované číselné hodnoty alebo hodnoty kľúčových slov. Dostupné kľúčové slová, ktoré môžeme použiť s touto vlastnosťou, sú normálne, tučné, svetlejšie a odvážnejšie . Číselná hodnota môže byť 100, 200, 300, ........., až 900. Vyššia číselná hodnota predstavuje hrubšiu váhu písma ako nižšie číselné hodnoty.

Syntax

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

The číslo vo vyššie uvedenej syntaxi predstavuje číselné hodnoty. Číselná hodnota 400 je rovnaká ako hodnota kľúčového slova normálne a hodnotu 700 je rovnaká ako hodnota kľúčového slova tučný .

The normálne hodnota strong> definuje normálne znaky a tučný hodnota určuje hrubé znaky. The odvážnejší hodnota predstavuje tučnejšiu váhu písma a ľahší hodnota predstavuje ľahšiu váhu písma ako je váha zdedená od rodiča.

Pozrime sa, ako použiť tučný text v CSS pomocou ilustrácie.

Úvod

CSS je známy ako výkonný nástroj na vývoj webovej stránky. Pomocou toho môžeme upravovať obsah HTML mnohými spôsobmi. Jednou z najbežnejších vlastností štýlu webovej stránky je použitie vlastnosti font-weight. Pomocou tučného textu môžeme zdôrazniť kľúčové informácie a vizuálny kontrast a tiež zlepšuje čitateľnosť obsahu.

Pochopenie vlastnosti hmotnosti písma

V CSS existuje vlastnosť Font-Weight, ktorá slúži na definovanie hmotnosti alebo hrúbky písma. Určuje tiež stupeň tučnosti alebo svetlosti textu, pričom akceptovanie vyššej hodnoty označuje tučnejšiu váhu písma. Vlastnosť font-weight akceptuje rôzne hodnoty, ako sú číselné hodnoty a hodnoty kľúčových slov.

Rozsah číselných hodnôt leží medzi 100 a 900 s prírastkami po 100. Ak napríklad vezmeme hodnotu hmotnosti písma ako 400, potom je to normálne, zatiaľ čo hodnota hmotnosti písma 700 sa považuje za tučné. Tučné, tučnejšie, svetlejšie a Niektoré bežne používané hodnoty kľúčových slov.

Ako vytvoriť tučný text pomocou CSS

Tučný text môžeme vytvoriť v HTML pomocou CSS. Môžeme použiť vložené, interné alebo externé vlastnosti štýlu písma.

výnimka hodí java

1. Ako môžeme vytvoriť tučný text pomocou vloženého štýlu

Pomocou inline stylingu môžeme použiť vlastnosť font-weight priamo na konkrétny HTML prvok. Vezmime si príklad.

HTML kód:

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

Výkon

Vysvetlenie:

Vo vyššie uvedenom kóde sme použili inline CSS a použili sme vlastnosť font-weight ako tučné.

2. Ako môžeme vytvoriť tučný text s vnútorným štýlom

Tu musíme napísať vlastnosť CSS do značky head so značkou štýlu. Vezmime si príklad:

HTML kód:

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

Výkon

baran herec

Vysvetlenie:

Vo vyššie uvedenom kóde sme použili interný CSS a použili vlastnosť font-weight.

3. Ako môžeme vytvoriť tučný text s externým štýlom

Tu musíme vytvoriť externý súbor CSS a prepojiť ho so súborom HTML. Do tohto súboru CSS musíme napísať vlastnosť style. Vezmime si príklad.

HTML kód:

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

CSS kód:

 p { font-weight: bold; } 

Výkon

Vysvetlenie:

Vo vyššie uvedenom kóde sme použili externú vlastnosť CSS a implementovali vlastnosť font-weight.

Príklad

Pozrime sa, ako vytvoriť tučný text v rôznych odtieňoch pomocou nižšie uvedeného príkladu:

 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> 

Výkon