View Full Version : CSS/Webpage Help
OK, I need some CSS help and i didn't know where else to go. I am currently making a website using Macromedias Dreamweaver for my team and want to do the colored scroll bad (like the ones on here that are orange.) Well, i have NO idea where to start, and i tried copying code and i have no idea where to put it, I try reading texts and asking other people, and no one knows. If anyone can help me, please IM me on aim or just leave a message here, thanks!
-Dave
Greg Ross
24-04-2002, 22:10
Originally posted by Quain
OK, I need some CSS help and i didn't know where else to go. I am currently making a website using Macromedias Dreamweaver for my team and want to do the colored scroll bad (like the ones on here that are orange.)
Hi Dave,
I've played around with CSS just a little. Nothing fancy, but here is what I have. My CSS file (GWRBoard.css) contains the following:
body {
background-image: url(/GWRBoard/space.jpg);
background-color: #000033;
font-family:Verdana, Arial;
color: #FFFF33;
font-size:small;
}
input { font-family: "Courier New", Courier, mono; font-size: 10pt}
A:link {
color: #33CC33;
}
A:visited {
color: #99CC99;
}
A:hover {
color: #FF0033;
}
Then in the <head> section of each page I have a line that says:
<LINK type="text/css" rel="stylesheet" href="GWRBoard.css">
If you take a look at the source for one of CD's pages, you will see that they inline the CSS code inside the <head> block on each page:
<style type="text/css">
BODY {
scrollbar-face-color: #FF8800;
scrollbar-shadow-color: #FF6600;
scrollbar-highlight-color: #FF8800;
scrollbar-3dlight-color: #FF8800;
scrollbar-darkshadow-color: #000000;
scrollbar-track-color: #dddddd;
scrollbar-arrow-color: #000000; }
SELECT {
FONT-FAMILY: Verdana,Arial,Helvetica,sans-serif;
FONT-SIZE: 11px;
COLOR: #000000;
BACKGROUND-COLOR: #CFCFCF
}
TEXTAREA, .bginput {
FONT-SIZE: 12px;
FONT-FAMILY: Verdana,Arial,Helvetica,sans-serif;
COLOR: #000000;
BACKGROUND-COLOR: #CFCFCF
}
#all A:link, #all A:visited, #all A:active {
COLOR: #0000AA;
}
#all A:hover {
COLOR: #FF8800;
}
#sitelink A:hover {
COLOR: #FFFFFF;
}
#sitelink A:link {
COLOR: #000000;
}
#cat A:link, #cat A:visited, #cat A:active {
COLOR: #FF8800;
TEXT-DECORATION: none;
}
#cat A:hover {
COLOR: #FF8800;
TEXT-DECORATION: underline;
}
#ltlink A:link, #ltlink A:visited, #ltlink A:active {
COLOR: #0000AA;
TEXT-DECORATION: none;
}
#ltlink A:hover {
COLOR: #FF8800;
TEXT-DECORATION: underline;
}
.thtcolor {
COLOR: #000000;
}
#cdm {
FONT-WEIGHT: bold;
FONT-SIZE: 10px;
COLOR: #445669;
FONT-FAMILY: arial, helvetica, sans-serif;
TEXT-DECORATION: none
}
#cdm A.forummenu:link {
FONT-WEIGHT: bold;
FONT-SIZE: 11px;
COLOR: #000000;
FONT-FAMILY: arial, helvetica, sans-serif;
TEXT-DECORATION: underline;
}
#cdm A.forummenu:visited {
FONT-WEIGHT: bold;
FONT-SIZE: 11px;
COLOR: #000000;
FONT-FAMILY: arial, helvetica, sans-serif;
TEXT-DECORATION: underline;
}
#cdm A.forummenu:hover {
FONT-WEIGHT: bold;
FONT-SIZE: 11px;
COLOR: #FFFFFF;
FONT-FAMILY: arial, helvetica, sans-serif;
TEXT-DECORATION: none
}
#cdm A.forummenu:active {
FONT-WEIGHT: bold;
FONT-SIZE: 11px;
COLOR: #FFFFFF;
FONT-FAMILY: arial, helvetica, sans-serif;
TEXT-DECORATION: none
}
#hann {
FONT-WEIGHT: bold;
FONT-SIZE: 18px;
COLOR: #000000;
FONT-FAMILY: arial, helvetica, sans-serif;
TEXT-DECORATION: none
}
.nf { font-family: verdana, arial, helvetica, sans-serif; font-size: 10pt }
.sf { font-family: verdana, arial, helvetica, sans-serif; font-size: 10px }
.lf { font-family: verdana, arial, helvetica, sans-serif; font-size: 10pt; font-weight:bold }
</style>
You can do it either way, but I prefer the linked style sheet so if I decide to change my style, I only have to change it in one place.
Does that answer your question?
Brandon Martus
24-04-2002, 22:38
Yup. Thats how I would've answered.
You can get help on CSS at webmonkey.com (as well as HTML, JavaScript, and more)..
or dont hesitate to ask here, someone will know the answer :)
Ryan Curry
26-04-2002, 18:49
http://www.hthsfury.org, just steal my source code and change the colors as you want them!
OK.. so all u CSS Guru's.. i need some help.. where wut i'm pasting into my html...
<style type="text/css">
BODY {
scrollbar-face-color: #781276;
scrollbar-shadow-color: #FFFFFF;
scrollbar-highlight-color: #781276;
scrollbar-3dlight-color: #781276;
scrollbar-darkshadow-color: #000000;
scrollbar-track-color: #56527A;
scrollbar-arrow-color: #000000; }
that makes it purpley and such, yea.. grand.. now.. my problem is... I put it after the title and meta tags... and when its in there.. it stops after it loads the scroll bar. It dosn't load any of the content after that... I have no idea wut i did wrong? any suggestion...
If its easier, feel free to im me on the aim SN: SnoManX
Brandon Martus
03-05-2002, 12:17
did you close the style tag?
</style>
Greg Ross
03-05-2002, 19:09
Originally posted by Brandon Martus
did you close the style tag?
That was going to be my guess too.:)
hah.. no.. i'm a fool.. but i'm learning.. i forgot u gotta close stuff like that.... thx guys... :D
Brandon Martus
06-05-2002, 10:15
It should work the same way, with all CSS in the same file.
Only certain browsers support the scroll-bar modifications though.
I'm pretty sure older 4.x versions of Netscape do not support it, along with Macintosh browsers.
[weird, this is a reply to the post below ... interesting how he posted in the future..]
Alright... Can you link in the code for the scroll bar? My example code is below...
<link rel="stylesheet" href="robotics.css" type="text/css">
I got the link to work with other type of css such as the body and the headers... but not the scroll bar.. i'm not sure if its possible?? *shrug* Not many sites are available to help with the scroll bar problems..
it dosn't work.. I have NO idea why... i've heard it should work.. but i don't know... :mad:
Greg Ross
06-05-2002, 20:02
Originally posted by Quain
it dosn't work.. I have NO idea why... i've heard it should work.. but i don't know... :mad:
The difference between linking an external stylesheet and inlining it is the <style> tag. You only need it if it is inlined.
If i have the style tag... it dosn't work.. if i don't have the style tag, it dosn't work. Heres the exact process i'm doing...
-I'm making it in Macromedias Dreamweaver 4. It has a CSS tab.. i import the file as a Link Rel and the file only describes the scroll bar colors. The colors don't change.. they stay normal. I took the code from another site and changed it to my specs... my paths. .etc.. and it still dosn't work... Tho.. if i paste the code inline, it works fine... *shrug*
Brandon Martus
07-05-2002, 11:49
post a link and I'll take a look at it...
it'll be easier to help with something to look at
alright.. i'll try and get one soon... I unfortunately can't upload to our normal comp server.. *sigh* but i'm workin on it.. thx in advance for helping..
OK.. On your site, www.pubarso.com, you have the box in the middle... It isn't a frame.. i think.. i think u did it with CSS.. i'm currently trying to do that with another site i'm making.. (which currently isn't uploaded either.) Umm, how did you place that? I read the section on webmonkey.com but it didn't help too much. Thx...
Adrian Wong
07-05-2002, 17:06
I think what you're talking about are IFRAMEs. They are basically framed windows nestled within a normal web page layout. IFRAME stands for Inline Frame (kind of like inline images).
The W3C specification is here: Inline frames: the IFRAME element (http://www.w3.org/TR/html4/present/frames.html#h-16.5). If you prefer something not as dry as the W3C specs, here is an article from Webmonkey that you might enjoy reading: The IFrames lowdown (http://hotwired.lycos.com/webmonkey/96/37/index2a.html).
Brandon Martus
07-05-2002, 19:39
Yes.
older Netscape does not support IFRAME though, so .. try to visit pubarso.com with Netscape, and you'll get booted to a "sorry, use a newer browser" message.
Yes, I lose a little traffic, but not enough that I care enough to not use an IFRAME :)
Dave Hurt
08-05-2002, 09:07
Ok, so what's the difference between Iframe's and layers inside of Dreamweaver? Or are they the same thing?
I know that with the Layers in DW... you can't name them and you can't load up an external html file like an IFrame... (or a regular frame.)
Alright... Heres what I'm trying to do. I have the IFrame call in the frame with this:
IN THE HEADER:
<style type="text/css">
#floatframe {position:absolute;
left: 160px;
top: 105px;
z-index: 100
}
</style>
IN THE BODY:
<iframe width=556 height=277 frameborder=0 align=left scrolling=no name=contentback opacity="25"></iframe>
It COMPLETELY blocks out everything behind it. I want it to show through so you can see the background behind it. Is it possible? Maybe it can be an image that has a low opacity...?
OK.. i finially got the site done after a weeks of running around reading and reading and reading.. THANK YOU guys for everything.. and Brandon.. i leeched some Javascript code from your site, but put a thanks in my code saying where i got it from.. i hope its ok.. if its not.. lemmie know.. i'll try and find a substitution.. or write my own javascript.. *shudder*
Brandon Martus
10-05-2002, 22:56
its cool
im sure i borrowed it from somewhere else :)
vBulletin® v3.6.4, Copyright ©2000-2017, Jelsoft Enterprises Ltd.