Klockan :
 CSS, layout - Rullningslist 2002-07-09 01:13:39 
 Information om författaren :
Namn : Hans Jonsson
Epost : hasse@aspwebb.com
Hemsida : http://www.hejonsson.com
Presentation :
Medarbetare på ASPWebb!
 Meny :
Startsidan (www.aspwebb.com)
Artikelarkivet
Föregående sida
Utskriftsvänlig sida
Kommentera artikel

CSS, layout - Rullningslist

Vill med denna artikel gör er uppmärksamma på det enkla ingrepp som kan göras med hjälp av just Cascading Style Sheet.

 

Personligen har jag svårt för att se en snygg sida förstöras av dessa otroligt tråkiga grå standard rullningslister som Microsoft tillämpar i sin webbläsare IE.

 

OBS! Notera att detta endast funkar i IE 5.5 +

 

Man kan se CSS som lite objekt orienterat precis som JavaScript. Även om det inte är så fullt ut.

 

Vi tänker oss helt enkelt först VAD är det som vi vill påverka, i detta fallet rullningslisten.

 

Och eftersom det är Amerikanarna som påfunnit detta språk så omvandlar vi det till deras språk.

 

Alltså:

                 Rullningslist = scrollbar

 

Och vad vill vi påverka med detta objekt? Jo utseendet = FACE och färgen = COLOR.

 

Så här:

 

                 Scrollbar-face-color:

 

Och sen lägger vi till värdet, alltså vilken färg vi vill ha på rullningslisten.

 

Fullständig:

 

                 Scrollbar-face-color: #00ff00;

 

Notera att i CSS så byts = tecknet ut mot kolon (:). Och dom olika värdena separeras med semikolon (;). Allt detta tillämpas på body – elementet.

 

För er som är nya med Cascading Style Sheet, se kommande artiklar då jag ska ta det från början.

 

Detta kan du b.la använda på rullningslisterna (scrollbars).

 

                 scrollbar-track-color: [värde]

scrollbar-face-color: [värde]

scrollbar-darkshadow-color: [värde]

scrollbar-shadow-color: [värde]

scrollbar-arrow-color: [värde]

scrollbar-highlight-color: [värde]

scrollbar-3dlight-color: [värde]

 

 

 

Individuell stilmall

 

<body style="scrollbar-face-color: #0000ff;">

 

 

Lokal och extern stilmall

 

 

body

{

scrollbar-face-color: #0000ff;

}

 

 

Se exempel:

                                   exempel.html

 

 

//Vill påminna om att ALLT som jag publicerar är taget ur just mina erfarenheter och kunskaper av ämnet, om ni finner nåt konkret att påpeka så maila mig gärna.//

 

 

Thats all for now folks!

 © 2010 Staff consulting - Jimmy Staff