HTML-språket inneholder en rekke elementer. Disse inkluderer ofte brukte nettstedskomponenter som avsnitt, overskrifter, lenker og bilder. Det er også en rekke nyere elementer som ble introdusert med HTML5, inkludert topptekst, nav, bunntekst og mer. Alle disse HTML-elementene brukes til å lage strukturen i et dokument og gi det mening. For å gi enda mer mening til elementer, kan du gi dem attributter.
En grunnleggende HTML-åpningskode starter med tegnet. For eksempel vil koden for innledende avsnitt være skrevet slik:
For å legge til et attributt til din HTML-tag, setter du først et mellomrom etter kodenavnet (i dette tilfellet er det "p"). Deretter vil du legge til attributtnavnet du vil bruke, etterfulgt av et likhetstegn. Til slutt vil attributtverdien plasseres i anførselstegn. For eksempel:
Tagger kan ha flere attributter. Du vil skille hvert attributt fra de andre med et mellomrom.
Elementer med påkrevde attributter
Noen HTML-elementer krever faktisk attributter hvis du vil at de skal fungere som forutsatt. Bildeelementet og koblingselementet er to eksempler på dette.
De bildeelement krever attributtet "src". Det attributtet forteller nettleseren hvilket bilde du vil bruke på det stedet. Verdien av attributtet vil være en filsti til bildet. For eksempel:
Du vil legge merke til at vi la til et annet attributt til dette elementet, "alt" eller alternativ tekstattributt. Dette er ikke teknisk et påkrevd attributt for bilder, men det er en best praksis å alltid inkludere dette innholdet for tilgjengelighet. Teksten som er oppført i verdien til alt-attributtet, er det som vises hvis en bildet kan ikke lastes inn av en eller annen grunn.
Et annet element som krever spesifikke attributter er anker- eller koblingstaggen. Dette elementet må inneholde attributtet "href", som står for "hypertekstreferanse." Det er en fancy måte å si "hvor denne lenken skal gå. "Akkurat som bildeelementet trenger å vite hvilket bilde som skal lastes inn, må koblingstaggen vite hvor det skal til. Slik kan en koblingstag se ut:
Denne lenken vil nå føre en person til nettstedet som er spesifisert i verdien av et attributt. I dette tilfellet er det hovedsiden til Dotdash.
Attributter som CSS-kroker
En annen bruk av attributter er når de brukes som "kroker" for CSS-stiler. Fordi nettstandarder tilsier at du skal holde sidestrukturen (HTML) atskilt fra stilene (CSS), bruker du disse attributtkrokene i CSS for å diktere hvordan den strukturerte siden vil vises på nettet nettleser. For eksempel kan du ha denne markeringen i HTML-dokumentet.
Hvis du vil at divisjonen skal ha en bakgrunnsfarge på svart (# 000) og en skriftstørrelse på 1,5 em, vil du legge til dette i CSS:
.featured {bakgrunnsfarge: # 000; skriftstørrelse: 1,5 em;}
Klasseattributtet "featured" fungerer som en krok som vi bruker i CSS for å bruke stiler på det området. Vi kan også bruke et ID-attributt her hvis vi ønsker det. Både klasser og ID-er er universelle attributter, noe som betyr at de kan legges til ethvert element. De kan også begge målrettes med spesifikke CSS-stiler for å bestemme det visuelle utseendet til det elementet.
Angående Javascript
Til slutt, bruk av attributter på visse HTML-elementer er også noe du kan bruke i Javascript. Hvis du har et skript som leter etter et element med et bestemt ID-attributt, er det enda en bruk av dette vanlige stykket i HTML-språket.