Click to See Complete Forum and Search --> : Help to change css
Taurus
10-31-2006, 01:20 PM
Need some help: just want modify template colors, not sure where is this colors locate in css, to change it color. Also, there is missing one border line, it seems. Template (http://sunbeam.phpnet.us/ ) , i want modify here (http://img250.imageshack.us/img250/3237/blogfu6.jpg).
I addition, i want just add a rollover effect(color swap) for horizontal menus(Home, About, Archives, Contact), like this menu (http://themes.wordpress.net/testrun/?wptheme=378).
WebJoel
10-31-2006, 02:36 PM
To change the background color of the page, change this:
body
{
margin: 0 auto;
padding: 0;
color: #333;
background: #585756 url("./themes/site_themes/default/bg.gif") repeat;
font-size: 80%
}
That is the "background-color" of the page.
--------------------------
To change the 'hover' effects, this part here (re-written slightly by me):
a:link { background-color: transparent; text-decoration: none; color: #663300; }
a:visited { background-color: transparent; text-decoration: none; color: #663300; }
a:hover { background-color: #663300; text-decoration: none; color: #fff; border-bottom:2px solid red;}
a:active {background-color:tan; text-decoration:none; color:#fff;}
the a:link is how a link appears when you first visit the page.
the a:visited is how the link appears if you've been there before.
the a:hover is what happens/how it looks when you hover-over the link.
the a:active is what happens when you depress & hold the pointer-tool over the link.
By changing the selectors of these (the background-color, the color (of the text), etc. and saving the CSS file, the effect is adopted and will take effect immediately in your HTML file.
For the "hover" effect, I added a 2-pixel red border-bottom, for greater impact.
Taurus
10-31-2006, 05:55 PM
thank you. For some reason, the screenshot i posted on web was lost, I send anew. There are two top boards(rules), I want change it color.
As to hover(rollover) effect, I want add it only for top navigation menu. All the rest links remains without changes. Also, there is missing one bottom border line, it seems. You can see this in blog2.jpg I attached images to amplify this.