Hvad er et eksternt stilark?

click fraud protection

Et eksternt stilark definerer, hvordan en webside ser ud. Du kan bruge et typografiark til at specificere ting som tekstens størrelse, farve og skrifttype, knappernes farve eller placeringen af ​​menuer og sidebjælker.

Kode bruges i et eksternt stilark

Der er to typer kode, der bruges til at oprette en grundlæggende webside:

  • HyperText-markeringssprog (HTML): Definerer indholdet på en webside. Den indeholder den faktiske tekst med en markering, der identificerer, om tekstsektioner er afsnit, overskrifter eller lister. Den indeholder også links til billeder, der vises på siden og hyperlinks til eksterne sider.
  • Cascading Style Sheets (CSS): Et kodningssprog, der bruges til at specificere, hvordan indholdet skal vises. Den definerer, hvordan hver type tekstelement vises og kan vise den samme type element forskelligt, hvis de tilhører forskellige klasser eller har en anden id. Dette gør det muligt for ting som menuer og lister at opføre sig meget forskelligt i hovedteksten på en webside.

Generelt er det en god ide at adskille stil fra indhold, da det giver dig mulighed for at fokusere på en ting ad gangen. Dette bliver endnu vigtigere i et team, så specialister inden for indhold og præsentation kan arbejde uafhængigt af resten. Måske vigtigere er det, at det også giver mulighed for at anvende et enkelt sæt stilinstruktioner ensartet på tværs af et helt websted.

instagram viewer

Den visuelle præsentation af hjemmesiden kan derefter ændres fra et enkelt typografiark uden at redigere hver webside individuelt. For større komplekse websteder kan et antal stilark bruges til at kontrollere tekst, menuer og inddelinger inden for sider. Denne samling af stilark kan kaldes et "tema".

Brug af en ekstern CSS til at linke HTML til CSS

Det er muligt at medtage CSS-stil direkte i HTML-en på en webside ved hjælp af CSS til individuelt at style hvert afsnit og overskriften forskelligt. Denne type inline styling er generelt ikke en god ide, da du mister alle fordelene ved at adskille stil fra indhold. Navnlig mister du evnen til at opdatere hele dit websted konsekvent fra en enkelt fil.

Den rigtige måde at anvende en typografi på et websted på er at oprette en enkelt ekstern stilarkfil til hver type stil, du vil anvende, og derefter henvise til disse filer fra hver HTML-fil. For eksempel kan du have følgende eksterne stilark:

  • text.css
  • menuer.css
  • layout.css

Du kan foretage ændringer i CSS-koden inden for disse eksterne stilark uden at ændre deres filnavne, hvilket betyder, at referencerne til disse filer inden for HTML på alle dine websider ikke vil være ændret.

Eksempler på HTML og CSS

En meget enkel HTML-side kunne indeholde følgende kode:




 Alt om mig!

Denne side handler om mig, og hvorfor jeg er fantastisk.


Hvis du vil se, hvordan dette ser ud i en webbrowser, skal du kopiere teksten til en teksteditor som Notesblok. Gem filen som noget som "index.html", og træk den ind i din browser for at se den gamle skolestil.

Et simpelt eksternt stilark kan linkes til denne side ved at tilføje følgende kode under.

type = "tekst / css"
href = "myStyle.css" />

Opret en anden tekstfil kaldet myStyle.css, der er placeret i samme mappe som index.html, der indeholder følgende kode:

h1 {
farve: # FF7643;
font-face: Arial '
}
p {
farve: rød;
skriftstørrelse: 1,5 em;
}

Der er meget mere, du kan gøre med CSS. Hvis du vil lære mere, W3 skoler er et godt sted at starte.

instagram story viewer