kaxigt.com

Jag skriver om webben för webben

10 grundläggande lektioner i CSS

Postad: 7 juni 2009 | CSS-guider | 5 Comments
Lästid: 42 minuter

10 grundläggande lektioner om css stilmall syntax. Hur fungerar egentligen CSS? Hur länkar vi in en stilmall till hemsidan? Hur ser syntaxen ut? Vad menas med allmänna cssmärkningar? Vad är fulhtml?

Detta, och mycket mycket mer, får du lära dig i guiden 10 grundläggande lektioner om CSS.

CSS PreProcessors som SaSS och LeSS berörs inte i denna guide.

Denna post innehåller kod-snippar som du kan använda. Det är alltid bra att ta en backup av din stilmall innan.

Översikt

Lektion 1

  1. En introduktion till CSS
  2. Inline, embedded och external css
  3. Vi gör en stilmall – steg för steg guide

Lektion 2

  1. syntax
  2. grupperingar och globala värden
  3. class-selector
  4. ID-selector

Lektion 3

  1. font-family
  2. font-style
  3. font-variant
  4. font-weight
  5. font-size

Lektion 4

  1. text-indent
  2. text-decoration
  3. text-align
  4. text-transform
  5. letter-spacing
  6. line-height
  7. word-spacing
  8. textfärg och bakgrundsfärg på en text
  9. No-wrap, radbrytning och paginerade dokument

Lektion 5

  1. Bakgrundsfärg
  2. Bakgrundsbild
  3. Position, repeat, attachment

Lektion 6

  1. Borderstyle
  2. Bordercolor
  3. Borderwidth
  4. Mer avancerade lösningar för border

Lektion 7

  1. Margin och padding

Lektion 8

  1. Unordered list – oordnade listor
  2. Ordered lists – ordnade listor
  3. List bullets – använd en bild
  4. Definierade listor

Lektion 9

  1. Grupperingar med div
  2. Grupperingar med ID
  3. Grupperingar med class
  4. grupperingar med span

Lektion 10

  1. Pseudo-class
  2. Pseudo-element
  3. Parent och first-child – genealogin