CSS 2.1
CSS-niveau 1, 2, 2.1, 3
- Niveau 2 bygger videre på niveau 1.
- Niveau 3 er under udvikling og derfor kun sparsomt understøttet af gængse nyere browsere.
- Niveau 2.1 er en finpudsning af niveau 2, med tilføjelser nyere browsere delvist understøtter, og er anbefalet standard af W3C (www-konsordiet). Gængse nyere og “ordentlige browsere med rent mel i posen” søger at understøtte disse standarder.
w3c Specifikationer og css-properties reference og browser support oversigt
Styles syntaks
SELECTOR { PROPERTY: VALUE; } /* Kommentering */
Selector – types
Tag / element: body, h1, p, osv.
ID : #navigation, #header, osv.
Class : .fun, .clear, .menu_item, .left, osv.
Pseudo Class : a:link, a:selected, a:hover, a:active.
Selector – contextual
#global_nav .selected a { PROPERTY: VALUE; }
Selector – compound
h1, h2, h3, h4, h5, h5 { color: #ff6600; }
Styles placering
Inline style
Som atribut i en tag:
<p style="font-size: .9em; line-height: 1.5em;">En paragraf </p>
Document style
STYLE tag, omkring css-indhold, beliggende i HEAD
<style type="text/css"> p { font-size: .9em; line-height: 1.5em; } </style>
External style
style.css, en tekstfil med rent css indhold
p { font-size: .9em; line-height: 1.5em; }
<link href="style.css" rel="stylesheet" type="text/css" />html-filer lænker til css.filen med ovenstående reference i HEAD
CSS Profiler, Media types
Referencen til det ekstene stylesheet kan udbygges med en atribut: media=”" – og vil målrette stylesheetet til det pågældende specifike medie.
Værdien “screen” er default, andre skal specificeres og fungerer som undtagelser.
Mulige Værdier: screen, print, handheld, projection, aural, m.fl.
<link rel="stylesheet" type="text/css" href="normal.css" /> <link rel="stylesheet" type="text/css" href="print.css" media="print" />
For at bygge et printervenligt stylesheet op er det nemmest at gå ud fra det almindelige til screen, og slette alle de uønskede element-definitioner. Det kan testes med print eller preview print.
CSS ressourcer
CSS referencer
w3schools.com, css examples
htmldog
CSS cheatsheet, css’ s periodiske system
CSS validering
Menuer og links
dynamicdrive
listamatic maxdesign
Layout
layouts fra.cssplay
Templates fra mycelly
maxdesign page_layouts
