De font-vekt egenskap i CSS brukes til å angi vekten eller tykkelsen på skriften. Den spesifiserer hvor tynne eller tykke tegnene i en tekst. De font-vekt egenskapen er enten avhengig av vektene spesifisert av nettleseren eller tilgjengelige skrifttyper i en skriftfamilie. Denne CSS-egenskapen definerer tynne til tykke tegn.
Den godtar den forhåndsdefinerte numeriske verdien eller nøkkelordverdiene. De tilgjengelige søkeordene som vi kan bruke med denne egenskapen er normal, fet, lettere og dristigere . Den numeriske verdien kan være 100, 200, 300, .........., opptil 900. Den høyere numeriske verdien representerer den fetere skriftvekten enn de lavere numeriske verdiene.
Syntaks
font-weight: normal | bold | bolder | lighter | number | initial | inherit;
De Antall i ovennevnte syntaks representerer de numeriske verdiene. Den numeriske verdien 400 er den samme som søkeordverdien normal , og verdien 700 er den samme som søkeordverdien dristig .
De normal strong>-verdien definerer de normale tegnene, og dristig verdi angir de tykke tegnene. De dristigere verdi representerer den dristigere font-vekten, og lighter verdi representerer den lettere skriftvekten enn vekten som er arvet fra overordnet.
La oss se hvordan du kan fet tekst i CSS ved å bruke en illustrasjon.
Introduksjon
CSS er kjent som et kraftig verktøy for utvikling av nettsiden. Ved hjelp av dette kan vi style HTML-innholdet på så mange måter. En av de vanligste egenskapene ved styling av nettsiden er å bruke en font-weight-egenskap. Ved hjelp av fet tekst kan vi fremheve nøkkelinformasjon og visuell kontrast, og det forbedrer også lesbarheten til innhold.
Forstå Font-Weight Property
I CSS er det en Font-Weight-egenskap, som brukes til å definere vekten eller tykkelsen på skriften. Den bestemmer også graden av tekstfethet eller lyshet, og aksept av den høyere verdien indikerer en dristigere skriftvekt. Font-weight-egenskapen godtar ulike verdier, for eksempel numeriske verdier og nøkkelordverdier.
java boolesk til streng
Utvalget av numeriske verdier ligger mellom 100 og 900, med trinn på 100. Hvis vi for eksempel tar skriftvektverdien som 400, er den normal, mens en skriftvektverdi på 700 anses som fet. Fet, dristigere, lettere og Noen ofte brukte søkeordverdier.
Hvordan lage fet tekst med CSS
Vi kan lage den fete teksten i HTML ved hjelp av CSS. Vi kan bruke innebygde, interne eller eksterne egenskaper for skriftstil.
1. Hvordan vi kan lage den fete teksten med innebygd styling
Ved hjelp av inline styling kan vi bruke egenskapen font-weight direkte til et spesifikt HTML-element. La oss ta et eksempel.
HTML-kode:
Document <p>Welcome to javaTpoint</p> <p>This is a bold text</p>
Produksjon
Forklaring:
I koden ovenfor brukte vi den innebygde CSS-en og brukte egenskapen font-weight som fet skrift.
2. Hvordan vi kan lage fet tekst med intern styling
Her må vi skrive CSS-egenskapen inne i head-taggen med style tag. La oss ta et eksempel:
konvertere streng til dato
HTML-kode:
Document p { font-weight: bold; } <p>Welcome to javaTpoint</p> <p>This is a bold text</p> Produksjon
Forklaring:
I koden ovenfor har vi brukt intern CSS og brukt egenskapen font-weight.
3. Hvordan vi kan lage fet tekst med ekstern styling
Her må vi lage en ekstern CSS-fil og koble den til HTML-filen. Inne i den CSS-filen må vi skrive stilegenskapen. La oss ta et eksempel.
HTML-kode:
Document <p>Welcome to javaTpoint</p> <p>This is a bold text</p>
CSS-kode:
kart med maskinskrift
p { font-weight: bold; } Produksjon
Forklaring:
I koden ovenfor har vi brukt den eksterne CSS-egenskapen og implementert egenskapen font-weight.
Eksempel
La oss se hvordan du lager fet tekst i forskjellige nyanser ved å bruke eksemplet nedenfor:
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> Produksjon
