Det skrifttype-vægt egenskab i CSS bruges til at indstille vægten eller tykkelsen af skrifttypen. Det angiver, hvor tynde eller tykke tegnene i en tekst. Det skrifttype-vægt egenskaben er enten afhængig af vægten specificeret af browseren eller de tilgængelige skrifttyper i en skrifttypefamilie. Denne CSS-egenskab definerer tynde til tykke tegn.
Den accepterer den foruddefinerede numeriske værdi eller nøgleordsværdier. De tilgængelige søgeord, som vi kan bruge med denne ejendom er normal, fed, lettere og dristigere . Den numeriske værdi kan være 100, 200, 300, .........., op til 900. Den højere numeriske værdi repræsenterer den mere fede skrifttype end de lavere numeriske værdier.
Syntaks
font-weight: normal | bold | bolder | lighter | number | initial | inherit;
Det nummer i ovenstående syntaks repræsenterer de numeriske værdier. Den numeriske værdi 400 er den samme som søgeordsværdien normal , og værdien 700 er den samme som søgeordsværdien fremhævet .
Det normal strong> værdi definerer de normale tegn, og fremhævet værdi angiver de tykke tegn. Det dristigere værdi repræsenterer den mere dristige skrifttype-vægt og lettere værdi repræsenterer den lettere skriftvægt end vægten, der er arvet fra den overordnede.
Lad os se, hvordan man fed tekst i CSS ved at bruge en illustration.
Introduktion
CSS er kendt som et stærkt værktøj til udvikling af websiden. Ved hjælp af dette kan vi style HTML-indholdet på så mange måder. En af de mest almindelige egenskaber ved styling af websiden er ved hjælp af en egenskab med skrifttypevægt. Ved hjælp af fed tekst kan vi fremhæve nøgleinformationen og den visuelle kontrast, og det forbedrer også læsbarheden af indholdet.
Forståelse af Font-Weight Property
I CSS er der en Font-Weight-egenskab, som bruges til at definere skrifttypens vægt eller tykkelse. Det bestemmer også graden af tekstfedhed eller lethed, idet accept af den højere værdi angiver en mere fed skriftvægt. Egenskaben font-weight accepterer forskellige værdier, såsom numeriske og nøgleordsværdier.
java boolean til streng
Udvalget af numeriske værdier ligger mellem 100 og 900, med trin på 100. Hvis vi f.eks. tager skrifttypevægtværdien som 400, så er den normal, mens en skrifttypevægtværdi på 700 betragtes som fed. Fed, dristigere, lettere og Nogle almindeligt anvendte søgeordsværdier.
Sådan opretter du fed tekst med CSS
Vi kan lave den fed tekst i HTML ved hjælp af CSS. Vi kan bruge inline, interne eller eksterne skrifttype-egenskaber.
1. Hvordan vi kan skabe den fed tekst med inline styling
Ved hjælp af inline styling kan vi bruge egenskaben font-weight direkte til et specifikt HTML-element. Lad os tage et eksempel.
HTML kode:
Document <p>Welcome to javaTpoint</p> <p>This is a bold text</p>
Produktion
Forklaring:
I ovenstående kode brugte vi den inline CSS og anvendte egenskaben font-weight som fed.
2. Hvordan vi kan skabe fed tekst med intern styling
Her skal vi skrive CSS-egenskaben inde i head-tagget med style-tagget. Lad os tage et eksempel:
xvideoservicethief ubuntu 14.04 download
HTML kode:
Document p { font-weight: bold; } <p>Welcome to javaTpoint</p> <p>This is a bold text</p>
Produktion
Forklaring:
I ovenstående kode har vi brugt intern CSS og anvendt egenskaben font-weight.
3. Hvordan vi kan skabe fed tekst med ekstern styling
Her skal vi oprette en ekstern CSS-fil og linke den til HTML-filen. Inde i den CSS-fil skal vi skrive stilegenskaben. Lad os tage et eksempel.
HTML kode:
Document <p>Welcome to javaTpoint</p> <p>This is a bold text</p>
CSS kode:
bash hvis tilstand
p { font-weight: bold; }
Produktion
Forklaring:
I ovenstående kode har vi brugt den eksterne CSS-egenskab og implementeret egenskaben font-weight.
Eksempel
Lad os se, hvordan du opretter fed tekst i forskellige nuancer ved at bruge nedenstående eksempel:
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>
Produktion