Backgrounds and CSS (Full Version)

All Forums >> [Web Development] >> Cascading Style Sheets and Accessibility



Message

GMisner -> Backgrounds and CSS (9/19/2005 13:47:19)

I want to place a background image in my table headers to tie my data tables to the theme of my page....
Can anyone tell me what syntex should be in the style to add the backgrounds... Also how do I create a specific link to the img instead of the .. that FP added.


If you want to see what it looks like it can be found at troop245.com choose leadership then event planner...

Thanks for any help you can provide...

CSS TD definitions...

TD.header {
font-family: "Times New Roman";
font-weight: bold;
Text-align="center";
color="#FFFFFF";
font-size=14pt;
}


a.TDHeader{text-decoration: none; }
a.TDHeader:link {color: #FFFF00;}
a.TDHeader:visited {color: #FFFF00; }
a.TDHeader:focus,
a.TDHeader:hover {color: #FF9900;text-decoration: underline; }
a.TDHeader:active {color: #FF9900;text-decoration: underline; }


Table Definition

<tr>
<td class= header width="16%" background="../images/topheader_fill.jpg">Event</td>
<td class= header width="8%" background="../images/topheader_fill.jpg">Start Date</td>
<td class= header width="8%" background="../images/topheader_fill.jpg">End Date</td>
<td class= header width="10%" background="../images/topheader_fill.jpg">Adult Leader</td>
<td class= header width="14%" background="../images/topheader_fill.jpg">Scout Leader</td>
<td class= header width="19%" background="../images/topheader_fill.jpg"><a class=TDHeader href="Permission_Request.htm"><b>245 Permission</a></td>
<td class= header width="20%" background="../images/topheader_fill.jpg">Other Permission</td>
</tr>



jaybee -> RE: Backgrounds and CSS (9/19/2005 14:04:41)

TD.header {
font-family: "Times New Roman";
font-weight: bold;
Text-align="center";
color="#FFFFFF";
font-size=14pt;
background: url(image.gif);
}

To give a non FP reference

/ is the root folder so just specifying that will take you to your homepage (but not in FP preview)

/nextlevel/file.htm

/nextlevel/thirdlevel/file.htm



coreybryant -> RE: Backgrounds and CSS (9/19/2005 14:10:58)

Not exactly sure if this is what you had in mind: 
td.header 
{
font-family: times;
font-weight: bold;
text-align: center;
color:#FFFFFF;
font-size:14pt;
background-image: url('../images/background.gif');
}

I made a few changes to your CSS sheet as well. You can also use the CSS validator as well to help with minor error



GMisner -> RE: Backgrounds and CSS (9/19/2005 14:27:03)

Thanks, I got it going.

A couple more newbe questions[8|]

1, If I understand you FP needs the .. to "move" to root. When publishing, I can just use the root notation/.

2. is there a difference in the background and background-Image syntax. my guess is background is just shorthand.

Thanks for all the help...[:)]



coreybryant -> RE: Backgrounds and CSS (9/19/2005 17:48:01)

With reards to FP moving to the root, I think you are referring to the code which is really different, but making the URL virtual is usually a better choice. You will not be able to see the background image though if you do use a virtual URL on your Frontpage

The background you are using is HTML and the one that I used is CSS, slightly different. you can read more about CSS backgrounds if you wish.



Page: [1]

Valid CSS!




Forum Software © ASPPlayground.NET Advanced Edition 2.4.5 ANSI
0.046875