Helpful Information

Category: HTML & CSS

CSS external code

I realize this seems like a relatively simple question :confused:

But here goes:

I want to get my scrollbar to change colors, but I want to do it using external CSS. I've been trying a long time to figure this out, but to no success.

If someone could help me out, I would really appreciate it! Thanks a bunch.

Just make a text file that says this:

BODY {
SCROLLBAR-BASE-COLOR: #86BF4B;
SCROLLBAR-ARROW-COLOR: #000000;
}

Then name it something like myfile.css (just make sure it has a .css extension). From there all you need to do is unclude this code in the head section of your page:

<link rel="stylesheet" type="text/css" href="myfile.css">

That should work, come back if you need more help!!!

http://www.dynamicdrive.com/dynamicindex11/barcolor.htm

and

http://www.dynamicdrive.com/dynamicindex11/scrolleffect.htm

My way of doing it...
Open Notepad
Paste code
remove the following lines:
<style>

</style>
save file as whatever.css

well i need the code in this context:

p {color: #ffffff; font-size: 11pt; font-style: normal; font-family: "Lucida Sans Unicode", sans-serif; text-align: left;}
A:link {color: #9933CC;}
A:visited {color: #ffffff;}
A:hover {color: #d2691e;}
body {background-color: #a8cdec;}
img {align: center;}

thats exactly how my code looks for my external css file

how does the scrollbar code fit into that?

thanks :)

how does the scrollbar code fit into that?

p {color: #ffffff; font-size: 11pt; font-style: normal; font-family: "Lucida Sans Unicode", sans-serif; text-align: left;}
A:link {color: #9933CC;}
A:visited {color: #ffffff;}
A:hover {color: #d2691e;}
body {background-color: #a8cdec; scrollbar-base-color: 86BF4B; scrollbar-arrow-color: #000000;}
img {align: center;}

That should do it for you. :thumbsup:

you don't need the quotes in the text name...

So, to sum things up here...

create a text file in notepad (or whatever text editor you may choose)

Put your CSS code into it:

BODY {background-color: #a8cdec; scrollbar-base-color: 86BF4B; scrollbar-arrow-color: #000000;}
p {color: #ffffff; font-size: 11pt; font-style: normal; font-family: Lucida Sans Unicode, sans-serif; text-align: left;}
A:link {color: #9933CC;}
A:visited {color: #ffffff;}
A:hover {color: #d2691e;}
img {align: center;}

now save that file as styles.css (You don't have to call it styles, just using it as an example.)

In your HTML pages, put this code:
<link rel="stylesheet" type="text/css" href="styles.css">

That's pretty much it,

if you run into any trouble with it, don't hesitate to ask.

~Quack

i think you are supposed to use quotes for fonts that are more than one word.

http://www.w3.org/TR/REC-CSS2/fonts.html#font-family-prop

:p