CSS 3 – del 1 – Introduktion

Introduktion till CSS3

Stilmallen – Cascading Style Sheet – är ett kraftfullt verktyg i vårt hemsidebyggande. Att skilja på struktur (HTML) och presentation (CSS) skapar också de bästa förutsättningarna för en standardisering med korrekt syntax. Det vi använder idag är en kombination av specifikationerna CSS level 2.1 och CSS3. I takt med nya och mer avancerade applikationer och ett ökat behov av att utveckla webben som exempelvis HTML5, så följer även CSS samma fotspår. CSS3 är av W3C rekommenderade webbstandarden.

Vad är då CSS3?

Man kan säga att CSS3 handlar om att bryta ned CSS till mindre moduler, exempelvis följande:

  1. Texteffekter
  2. Listmoduler
  3. Borders
  4. Bakgrunder
  5. Färger
  6. Box model
  7. User interface
  8. Flerkolumns layout (grid)

Det här innebär i sin tur att du bland annat kan göra skuggor på olika element, exempelvis på boxar och/eller fonten. Du kan göra rundade hörn utan bilder (en ännu mer enklare variant än runda hörn utan bilder enbart med css). Du kan skapa flera bakgrundslager på ett och samma element och att du själv kan få välja vilken font vill använda utan en massa javascript. Kort och gott så finns det en massa spännande och roliga effekter med CSS3. Chris Hanscom har på uppdrag av SM gjort en bra och överskådlig CSS3 cheat sheet över modulerna. Det går utmärkt att spara denna.

CSS3 kompatibla webbläsare

Vilka webbläsare kan hantera CSS3?

Idag 2017 klarar de flesta webbläsarna att hantera CSS3. Med CSS3 kan vi avlasta våra hemsidor eftersom behovet av Photoshopskapade bilder minskar då det finns liknande effekter i CSS3, det leder också till att sidan blir mer snabbladdad. Det öppnar sig också många spännande och olika möjligheter att skapa en ännu mer unik och personlig website som vi sedan kan fylla med intressant innehåll. Är det inte mot det vi alla egentligen strävar?

Testa  gärna din webbläsare för att se vilka CSS3 moduler den stöder.


HTML6 och CSS4 håller på att arbetas fram för att bli den nya tekniken inom webbdesign, dock kommer vi få vänta i många år innan allt blir klart. Du kan redan nu kontrollera om din webbläsare klarar av att rendera de CSS4-selektorer som redan är klara. Spännande!

Author: Lena

Lena är en riktig web geek med sikte mot web standards. Hon har både fått utmärkelsen Årets WebQueen som att ha blivit omskriven för sina insatser på nätet. Hennes stora intresse är gränssnitt. Lena är gränssnitt- front end designer och har studerat design, gränssnitt, tillgänglighet, användbarhet och web standards på Blekinge Tekniska Högskola.

Kommentera

E-postadressen publiceras inte. Obligatoriska fält är märkta *