PDA

View Full Version : goodyear's homepage, question


fabian9931
09-18-2009, 01:07 PM
Hello everyone, I am a amature when it comes to html but i have been practicing and have been doing this as a hobby, i "view source" on alot of sites to try and learn if the site catches my eye. but i post today because i wanted to know how the background is done at the goodyear.com home page. im talking about the blue background faded to black at the top. I viewed the source but couldn't see any background tags, is it just an img done on Photoshop then added as an img? and im also interested in the line seperating the footer links. any ideas?

coloeagle
09-18-2009, 02:18 PM
yes, a small 1px wide gradient image added to the body with css. Then a body color to match the bottom of the image.

The footer divider line is also an image.

fabian9931
09-18-2009, 03:02 PM
ok thanks. i understand that. but if my current design does have a css file but for my sprymenu should i make another css file or edit that one? and If i make one, how do i link the css file to the html?

i made a 1 px wide gradient image and made the css file and entered :

body
{
background-image:url(../gradient.jpg)background-repeat:repeat-x;
background-repeat:repeat-x;
}

but im not getting the background to show, when i preview it (f12)

coloeagle
09-18-2009, 06:50 PM
You have your styling for the image wrong. You have the background-repeat inside the image styling
In short hand it should be;

body {
background: #??? url(../gradient.jpg) top left repeat-x;
}Replace the #??? with the color you need for the background this will fill the window with your choice of color under and after the image.
"top left" will place the image starting point
"repeat-x" will let the image repeat itself horizontally across the top of the browser window.

Also insure your path to the image is correct.

for my sprymenu should i make another css file or edit that one?
I don't understand exactly what you are asking.

fabian9931
09-18-2009, 07:15 PM
I don't understand exactly what you are asking.


ok what im saying is, on my current index. I have a drop down menu that opens up and all, well when i inserted that menu DW made a CSS file for me called sprymenu.css, under that css is all the stuff the menu needs to operate. my question is do i make a new css file. or insert that on the exsisting css (sprymenu) file? either or, how do i connect the two? link it so the html reads the css. when i f12 and preview it on my hard drive i should be able to see the background right? or is this something i can only see live after it was ftp'd. hopefully i explained myself enought, thanks

fabian9931
09-18-2009, 07:21 PM
ok here is my html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />
</head>
<body>
<ul id="MenuBar1" class="MenuBarVertical">
<li><a class="MenuBarItemSubmenu" href="#">Item 1</a>
<ul>
<li><a href="#">Item 1.1</a></li>
<li><a href="#">Item 1.2</a></li>
<li><a href="#">Item 1.3</a></li>
</ul>
</li>
<li><a href="#">Item 2</a></li>
<li><a class="MenuBarItemSubmenu" href="#">Item 3</a>
<ul>
<li><a class="MenuBarItemSubmenu" href="#">Item 3.1</a>
<ul>
<li><a href="#">Item 3.1.1</a></li>
<li><a href="#">Item 3.1.2</a></li>
</ul>
</li>
<li><a href="#">Item 3.2</a></li>
<li><a href="#">Item 3.3</a></li>
</ul>
</li>
<li><a href="#">Item 4</a></li>
</ul>
<script type="text/javascript">
<!--
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
//-->
</script>
</body>
</html>


so see how DW made me a sprymenubarvertical.css file, do i enter my tags for the background in that css file or do i make a new css file, and if i do how do i link it so my current html links to that css file.

coloeagle
09-18-2009, 07:23 PM
Do you have another css file for the rest of the page or is the spry.css the only one you have?
If you have another one I would place it in that file.

To call the css file you need to place a call tag inside the head tags.

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

fabian9931
09-18-2009, 07:26 PM
thats the only css file i have. so i would have to make a new one correct? when i call the css file, i would insert that between the head tags on the index right? thanks for the help

coloeagle
09-18-2009, 07:28 PM
You can add it to the spry css and be ok. But since it is for the entire page I would do a separate css file. Have this file hold the rest of the css page layout and design.
Will make it a bit easier for future changes.

coloeagle
09-18-2009, 07:28 PM
thats the only css file i have. so i would have to make a new one correct? when i call the css file, i would insert that between the head tags on the index right? thanks for the help
Correct :-D

Your welcome