Skip to main content

Hvordan og hvornår skal man bruge et vægtmærke i HTML

Learn HTML code: emphasis tag (April 2025)

Learn HTML code: emphasis tag (April 2025)
Anonim

Et af de tags, du vil lære tidligt i din webdesign uddannelse, er et par mærker kendt som "vægtetiketter." Lad os se på, hvad disse tags er, og hvordan de bruges i webdesign i dag.

Tilbage til XHTML

Hvis du har lært HTML år siden, godt før stigningen af ​​HTML5, brugte du sandsynligvis både fed og kursiv tags. Som du ville forvente, skiftede disse tags til henholdsvis fed skrift eller kursiv tekst. Problemet med disse tags, og hvorfor de blev skubbet til fordel for nye elementer (som vi vil se på kort tid), er, at de ikke er semantiske elementer. Dette skyldes, at de definerer, hvordan teksten skal se frem for at få oplysninger om teksten. Husk, HTML (som er, hvor disse tags ville blive skrevet) handler om struktur, ikke visuel stil! Visuelle håndteres af CSS og webdesign bedste praksis har længe fastslået, at du bør have en klar adskillelse af stil og struktur på dine websider. Dette betyder ikke at bruge elementer, der ikke er semantiske, og hvilke detaljer ser ud snarere end struktur. Derfor er de dristige og kursive tags generelt blevet erstattet af stærk (for fed) og vægt (for kursiv).

og

De stærke og vægtelementer tilføjer information til din tekst, der beskriver indhold, der skal behandles anderledes og fremhæves, når indholdet tales. Du bruger disse elementer stort set på samme måde som du ville have brugt fed og kursiv i fortiden. Du skal blot omslutte din tekst med åbnings- og lukkekoderne ( og til vægt og og for stærk vægt) og den vedlagte tekst vil blive understreget.

Du kan rede disse tags, og det er ligegyldigt, hvilken ekstern tag du har. Her er nogle eksempler.

Denne tekst understreges og de fleste browsere ville vise det som kursiv.

Denne tekst understreges stærkt og de fleste browsere ville vise det som fed skrift.

I begge disse eksempler dikterer vi ikke visuelt look med HTML'en. Ja, standard udseende af tag ville være kursiv og ville være fed, men disse udseende kunne nemt ændres i CSS. Dette er det bedste fra begge verdener. Du kan udnytte standardwebstedsstilerne til at få kursiv eller fed tekst i dit dokument uden at krydse linjen og blandestrukturen og stilen. Sig, at du ville have det tekst til ikke kun at være fed, men også at være rød, du kan tilføje dette til CSS

stærk { farve: rød;}

I dette eksempel behøver du ikke at tilføje en egenskab til den fed skriftstørrelse, da det er standard. Hvis du ikke vil overlade det til en chance, kan du dog altid tilføje det i:

stærk { font-weight: bold; farve: rød;}

Nu ville du være alt, men garanteret at have en side med fed (og rød) tekst, uanset hvor tag bruges.

Dobbelt op på vægt

En ting jeg har bemærket i løbet af året er, hvad der sker, hvis du forsøger at fordoble på vægt. For eksempel:

Denne tekst skal have begge fed og kursiv tekst inde i den.

Du ville tro, at denne linje ville producere et område, der har tekst, der er fed og kursiv. Nogle gange sker det faktisk, men jeg har set nogle browsere kun ære den anden af ​​de to vægtstile, den nærmeste til den aktuelle tekst, og kun vise dette som kursiv. Dette er en af ​​grundene til, at jeg ikke fordobler på vægtmærker.

En anden grund til at undgå denne "fordobling" er for stilistiske formål. En form for vægt, hvis det normalt er nok at formidle den tone, du ønsker at indstille. Du behøver ikke at modige, kursivere, farve, forstørre og understrege tekst for at det kan skille sig ud. Den tekst, vil alle de forskellige former for vægt blive skarp. Så vær forsigtig, når du bruger vægtmærker eller CSS-stilarter til at lægge vægt på og ikke overdrive det.

En note på fed og kursiv

En sidste tankegang - mens den dristige () og kursiv () tags anbefales ikke længere til at blive brugt som vægtelementer, der er nogle webdesignere, der bruger disse tags til at style inline områder af tekst. Dybest set bruger de det som a element. Det er godt, fordi tagsne er meget korte, men det anbefales ikke generelt at bruge disse elementer på denne måde. Jeg nævner i, hvis du ser det derude på nogle websteder, der bruges til ikke at skabe fed eller kursiv tekst, men at oprette en CSS-krog til en anden form for visuel styling.

Originalartikel af Jennifer Krynin. Redigeret af Jeremy Girard den 12/2/16.