Webdesigner.dk

  • Forside
  • Lav en hjemmeside
  • Lav en blog
  • WordPress hjælp
  • WordPress temaer
  • Seneste artikler
  • Værktøjer
  • Om

Hvad er HTML og CSS og hvorfor bruge tid på sætte mig i det?

Tweet
Share
Share

Kort fortalt er HTML og CSS de to kode-sprog som ligger bag enhver moderne hjemmeside. Det er altså html og CSS der sørger for at tekst, billeder, design osv. vises til brugeren gennem deres Internet browser.

Ønsker du f.eks at lave en ændring på layoutet i et WordPress tema, vil du i mange tilfælde kunne klare det selv at have en viden om HTML og CSS.

HTML kom først til verden

At lave en hjemmeside i HTML (Hypertext Markup Language) er den mest basale måde at lave en hjemmeside på. HTML er opbygget af tags og det er disse tags der sørger for at placere og formatere tekst og billeder.

Her er eksempel på en HTML tag:

<strong>skriv denne tekst med fed</strong>

Denne tag gør at teksten vil blive skrevet med fed. Den første tag <strong>er en start tag og den sidste del med skråstregen </strong> er en slut tag. Det er altså kun teksten i mellem de to tags der vil blive markeret med fed.

Som bruger ser vi ikke disse bagvedliggende HTML tags, men de bruges på praktisk talt alle hjemmesider. Ved at højre klikke i din Internet browser og vælge “vis kilde” kan du se alle de HTML tags der er brugt til at opbygge den hjemmeside du kigger på.

Ved at bruge en lang række af forskellige HTML tags kan størrelsen på teksten ændres, farverne, layoutet osv. Da der er ganske mange HTML tags henviser jeg til html.net (eng) for mere dybdegående information omkring opbygningen af html.

CSS prøver at overtage verden

Når det kommer til mere avanceret formatering og layout på hjemmesider træder CSS (Cascading Style Sheets) i karakter. CSS gør det muligt at ændre hele layoutet på din hjemmeside ved at ændre i en enkelt fil.

  • Ønsker du f.eks. at ændre tekstfarven på samtlige links på din hjemmeside, kan det gøres ved at  ved at rette farven ét sted i CSS filen.
  • Er din side kun opbygget i HTML skal du rette farve-koden manuelt i samtlige filer på din hjemmeside. Består dit website af fem sider ville dette ikke være det store problem, men prøv så at forstil dig en hjemmeside med flere hundrede sider.
  • Med CSS er det altså muligt at styre hele designet fra en enkelt fil. Samtidig giver CSS en lang række grafiske muligheder som ikke er mulige at lave kun ved brug af HTML.

CSS er ligesom HTML opbygget af tags. Her er et eksempel på et CSS tag:

<div id=”tekst-formatering”>formater denne tekst</div>

Den tekst der står i mellem start tagget <div id=”tekst”>og slut tagget </div> vil så blive formateret i henhold til det der er angivet i CSS filen.

CSS bliver brugt mere og mere

Fordelene ved CSS virker måske umiddelbart ret begrænsede, men opbygges en hjemmeside korrekt i CSS vil du praktisk talt kunne lave et helt nyt design, udelukkende ved at ændre i CSS filerne.

Ud over dette bruges CSS også til at lave hjemmesider responsive således at de vises korrekt på mobiltelefoner, iPads osv. CSS er derfor kommet for at blive og ses anvendt på flere og flere hjemmesider.

Er du interesseret i at lære mere om CSS kan jeg som sagt anbefale at se nærmere på html.net, da de dækker både CSS og HTML rigtig godt.

Relaterede indlæg:

  1. Hvad er Google Analytics og hvilke fordele giver Analytics mig?
  2. Hvad er søgemaskineoptimering og hvordan kan SEO give mig flere besøg?
  3. Hvad er responsive webdesign og hvorfor skal en hjemmeside være responsive?
  4. Det domænenavn jeg havde tænkt mig er optaget – Hvad gør jeg nu?

Skrevet i: Hjemmeside FAQ

Avatar for Anders Christensen

Om Anders Christensen

Anders Christensen har arbejdet med hjemmesider og online markedsføring i over 15 år. Jeg er her for at hjælpe dig med at få lavet den bedst mulige hjemmeside. Webdesigner, online entrepreneur & musiker.

Kommentarer

  1. Avatar for lailalaila skriver

    4. marts 2015 kl. 13:14

    Hej – jeg er igang på en demo.

    Jeg har hentet theme “storefront” som understøtter woocommerce.

    Jeg vil gerne ændre på fx. margin på knapperne i shoppen, men jeg kan ikke finde ud af hvor woocommerce css filen ligger. Jeg kan godt se jeg kan farvestyle forskellige elementer – men selve cssfilen kan jeg ikke finde. Har du et bud.

    Mvh
    Laila

    Svar
    • Avatar for AndersAnders skriver

      4. marts 2015 kl. 14:45

      CSS filen skulle gerne ligge under /assets/css/woocommerce.css. Du kan i øvrigt læse mere om css i wocommerce lige her: woothemes.com

      Svar
      • Avatar for lailalaila skriver

        5. marts 2015 kl. 10:09

        Tak for det Anders

        Svar
        • Avatar for LailaLaila skriver

          5. marts 2015 kl. 11:09

          Hej igen
          Er ikke helt med – skal jeg ikke finde det via venstremenuen?

          Svar
          • Avatar for AndersAnders skriver

            5. marts 2015 kl. 11:22

            Hvis det var mig ville jeg logge in via FTP, så kan du også tage en backup af woocommerce CSS filen før du redigerer i den 🙂

            Ønsker du at rette i CSS filen til Storefront temaet kan den findes i WordPress administrationen under Udseende ->> Editor ->> Vælg Storefront i dropdown ->> Klik på Stylesheet nederst.

            Husk at tage en backup før du laver ændringer.

            Svar
  2. Avatar for LailaLaila skriver

    5. marts 2015 kl. 14:52

    Jeg har nu kigget under plugin / editor og woocommerce men jeg kan ikke se css filen???

    Svar
    • Avatar for AndersAnders skriver

      5. marts 2015 kl. 17:51

      Vil du rette i woocommerce CSSfilen skal du som sagt gøre det via FTP. Det er kun temaets CSS fil du kan rette via WordPress administrationen.

      Bemærk at hvis du retter i wocommerce css filen, bliver dine ændringer overskrevet ved opdatering af woocommerce pluginet.

      Svar
  3. Avatar for www.bydianawi.comwww.bydianawi.com skriver

    7. april 2017 kl. 09:40

    Hej Anders,
    Nu er jeg her igen 🙂 Og håber du (igen kan hjælpe) 🙂
    Som du nok allerede ved, virker Google adsense pluginet ikke længere… Jeg kan i hvert fald ikke administrere mine ads via dette plugin længere.
    Jeg er nået dertil, hvor jeg har oprettet ads koder inde på min adsense konto, men jeg kan simpelthen ikke finde ud af HVOR de skal sættes ind og hvordan jeg skal kunne styre dem?? Hvor er min HTML? Den siger jeg skal sætte koden ind der, men når jeg bare sætte en script kode derind (på “bagsiden” af mine blogposts” kommer der kun en lille firkantet ikon frem… :-/
    Hvad er det jeg gør forkert?
    Hilsen Diana

    Svar
    • Avatar for AndersAnders skriver

      7. april 2017 kl. 16:11

      Jeg bruger det plugin der hedder WP-Insert. Her skal du blot vælge hvor du ønsker at dine AdSense annoncer skal vises, indsætte den pågældende kode til AdSense annoncen, aktivere annoncesektionen og klikke på update.

      Har du brug for en mere udførlig guide siger du bare til, så laver jeg en 🙂

      Svar

Skriv et svar Annuller svar

Din e-mailadresse vil ikke blive publiceret. Krævede felter er markeret med *

 

Alt om at lave din egen hjemmeside

Her på siden finder du alt hvad du skal bruge cookiesfor at lave en professionel hjemmeside.

Følg guiden under Lav en hjemmside  så får du en brugervenlig & søgemaskineoptimeret hjemmeside med eget domænenavn.
Velkommen til 🙂

Få e-bogen Sådan laver du din egen hjemmeside helt gratis!

Den komplette guide til at lave din egen hjemmeside & tjene penge online.
Lav din egen hjemmeside - Gratis ebog

Download din gratis ebog nu!

Seneste artikler

  • Blogindlæg skabelonBlogindlæg layout: Den ultimative guide til at skrive et blogindlæg
    4. december 2020
  • SEO optimering af WordPressOptimering af WordPress – Step-by-Step guide
    11. november 2020
  • Lav en hjemmeside – Step-by-Step guide
    5. november 2020

Seneste kommentarer

  • Anders Christensen - 28 marts, 11:02
    Hej Nana. Hvad det koster afhænger hvilket type virksomhed der er man opretter. Som jeg skriver i artiklen herover er…
    Opstart af eget firma – Gode råd til dig som vil være iværksætter
  • Nana Saks - 27 marts, 06:33
    Hej Anders, jeg og en veninde har oprettet en Facebook business page med 2 grupper der tilhører den. Nu vil…
    Opstart af eget firma – Gode råd til dig som vil være iværksætter
  • Nina - 23 marts, 16:34
    Hej igen Tak Anders. Jeg vil prøve at slette de sider, der er problemer med og oprette dem på ny…
    Lav en hjemmeside – Step-by-Step guide
  • Allan - 23 marts, 06:05
    Hej Klaus Jeg købte Office 365 hvor jeg kan styre alle mine mails og kalender fra. Det andet var alt…
    Hvordan opretter jeg e-mail adresser til mit domæne?
  • Anders Christensen - 23 marts, 02:07
    Hejsa. Jeg kan se at fejlene du beskriver både optræder på mobil og pc. Hvis du prøver at gøre browser…
    Lav en hjemmeside – Step-by-Step guide

Pupulære artikler

Hvor kan jeg købe billige billeder til min hjemmeside?

Den komplette guide til at lave et nyhedsbrev

Hvor finder jeg gode WordPress temaer oversat til dansk?

Undgå fælden vælg ikke en gratis hjemmeside

Kategorier

  • Domænenavne
  • Generelle tips & tricks
  • Hjemmeside FAQ
  • Lav din egen hjemmeside
  • Lav en blog
  • Markedsføring online
  • Opret en hjemmeside
  • Skriv til nettet
  • Søgemaskineoptimering
  • Tjen penge online
  • Uncategorized
  • Valg af emne
  • Webhoteller
  • WordPress hjælp

Følg med i hvad der sker på webdesigner.dk

Besøg os på Facebook Følg os med RSS Følg os på YouTube

Co2 neutralt website

DIVI WordPress tema
123rf
genesis

Webdesigner.dk anbefaler at du hoster din hjemmeside hos Simply
Copyright © 2021 · Cookies · Genesis theme · Kontakt · Profil
Denne hjemmeside indeholder affiliate links
Lav din egen hjemmeside
CVR-nr.: 26570875

X
Gratis eBog fra Webdesigner.dk : Lær hvordan du laver en professionel hjemmeside!
Klik her