Grafisk profil: Nett: Profilhåndbok: Introduksjon | Sideutforming | Organisering av innhold
Innledning –
Fargebruk –
Typografi –
Grafikkbruk
CSS står for Cascading Style Sheets og blir på norsk ofte oversatt med stilsett eller stilark.
CSS vil si at en del informasjon om layout og formgivining fjernes fra selve HTML-dokumentet (eller mer presist, ut av <BODY>-elementet), og legges ett annet sted, ofte i en egen .css-fil. Men stilsettet kan også legges i f.eks. <HEAD>-elementet.
Poenget med CSS er at utseende skilles fra innhold. En bruker kan lage sitt eget stilsett, og bruke dette i stedet for det stilsettet som dokumentet refererer til. Dette kan være svært nyttig for fargeblinde, svaksynte og flere andre brukergrupper. Den som lager nettsider, kan også lette jobben sin betraktelig ved å knytte dokumentene sine opp mot et felles stilsett. Ved å gjøre en endring i stilsettet, vil alle dokumentene som er knyttet mot dette stilsettet, endres tilsvarende. Når 250 000 nettsider ved UiO benytter det samme stilsettet, er det lett å se arbeidsbesparelsen dersom man finner ut at man må justere profilen.
At stilsettet er "Cascading", betyr at det kan knyttes flere stilsett til ett og samme dokument.
Her kan du se hvordan UiOs sentrale stilsett for dokumentsider ser ut:
/* Malstilar */
h1, h2, h3, h4, h5, h6
{ color: black;
font-family: Arial, Helvetica, sans-serif; }
BODY { background-color: #ffffff;
font-family: Arial, Helvetica, sans-serif;
margin-top: 0px;
margin-left: 0px;
margin-right: 0px;
margin-bottom: 0px; }
ADDRESS, a, p, ol, ul, dd, dt, dl, li, td
{ font-family: Arial, Helvetica, sans-serif; }
.tdmargin70
{ margin-left: 70px;
font-weight: bold;
margin-top: 2px;
margin-bottom: 2px; }
.topbgblue { background-color: #0099cc; }
.topbggraa { background-color: #cccccc;
font-weight: bold;
font-size: 0.8em }
.topbggul { background-color: #ffcc00; }
.topbgred { background-color: #cc0000 }
.tdwidth70bgblue { background-color: #0099cc;
width: 70px; }
.topMenu { font-family: Arial, Helvetica, sans-serif;
font-size: 0.8em; }
.grafikktopplogo { border-width: 0px; }
.grafikkbotnlogo { border-width: 0px; }
.grafikkbanner { border-width: 0px; }
/*Brødtekststilar */
.navmarginbrod { margin-left: 70px;
margin-top: 20px; }
.navmarginline { margin-left: 70px;
margin-right: 0px; } |
Koden for å knytte en .css-fil til et .html-dokument ser slik ut:
<LINK HREF="/visuell-profil/css/uio.css" REL="stylesheet">.
Du kan lese mer om stilsett her:
Fra W3C (W3C (The World Wide Web Consortium) tar sikte på
å utvikle felles standarder for weben)
Webmonkey tilbyr noen
engelskspråklige
innføringer
og tips om CSS.
Profilhåndboken i Word-format, tilrettelagt for utskrift