HTML og CSS

  1. Lage en webside i VS CodeLage en webside i VS Code
    1. Installer VS Code
    Last ned og installer VS Code fra Visual Studio Code sin nettside.

    2. Opprett en mappe for prosjektet
    Opprett en ny mappe på datamaskinen som vil inneholde prosjektfilene dine...
  2. Lage en webside med HTMLLage en webside med HTML

    Introduksjon til HTML

    HTML (HyperText Markup Language) er grunnstrukturen i alle nettsider. Det brukes til å organisere innhold som tekst, bilder, lenker, knapper og mye mer. HTML består av tagge...
  3. Hvordan bruke CSS til å endre utseendet på nettsidenHvordan bruke CSS til å endre utseendet på nettsiden

    Introduksjon til CSS

    CSS (Cascading Style Sheets) brukes for å style og formatere HTML-elementer på en nettside. CSS består av regler som definerer hvordan elementer skal vises visuelt. Hver rege...
  4. CSS-velgereCSS-velgere
    Det finnes tre hovedtyper CSS-velgere: type, class og id. Eksempelet over er en typevelger. Typevelgere velger elementer basert på HTML-taggen. Under ser du eksempler på CSS-regler med typevelgere....
  5. div-elementetdiv-elementet
    <div> er et element som brukes mye i forbindelse med id- og klassevelgere. <div>-taggen gjør i utgangspunktet ingenting med innholdet, men brukes for å gruppere innhold eller til å hekt...
  6. Posisjonering i CSSPosisjonering i CSS
    Posisjonering i CSS brukes til å kontrollere hvor elementer skal plasseres på en nettside. CSS gir deg flere forskjellige måter å styre dette på, avhengig av hvordan du vil at elementene skal oppfø...
    1. Eksempel på en websidelayout med posisjonerte elementerEksempel på en websidelayout med posisjonerte elementer
      Her er et eksempel på en enkel nettside med et header, en navigasjonsmeny, et hovedinnholdsområde og en footer. Layouten er laget ved hjelp av forskjellige posisjoneringsmetoder i CSS.

      HTML-strukt...
  7. Lage en rask og enkel CSS-layout med floatLage en rask og enkel CSS-layout med float

    See the Pen
    bilde-med-float by NDLA (@ndla)
    on CodePen.



    Float er et attributt i CSS som brukes til å få elementer til å "flyte" ved siden av hverandre, for eksempel for å få bilder til å...
  8. Flexbox - en enkel måte å lage layoutFlexbox - en enkel måte å lage layout
    Flexbox, eller Flexbox Layout, er en CSS-teknikk som gjør det enklere å lage fleksible og responsive layoutstrukturer. Flexbox gir deg kontroll over hvordan elementer skal distribueres og justeres ...
  9. Hvordan midtstille elementer i en div enklest muligHvordan midtstille elementer i en div enklest mulig
    For å midtstille teksten i en <div> både vertikalt og horisontalt, kan du bruke CSS Flexbox. Dette er den enkleste og mest moderne måten å gjøre det på.



    Eksempel med CSS Flexbox

    <!DOCT...
  10. CSS-malCSS-mal
    Det kan være praktisk å lage en CSS-mal som kan gjenbrukes på de forskjellige prosjektene dine. Etter hvert som du lager flere nettsider vil de se at det er mange CSS-regler som vil gå igjen, og da...
  11. CSS-klasser for mer effektiv stylingCSS-klasser for mer effektiv styling
    Her er en liste over noen vanlige klasser som kan være nyttige å inkludere i en standard CSS-fil. Disse klassene er generelle og kan brukes på ulike typer elementer for å tilpasse utseendet uten å ...

Nyttige lenker