Computer Science Canada CSS -> Header Background Image |
Author: | copthesaint [ Wed Oct 05, 2011 12:59 pm ] |
Post subject: | CSS -> Header Background Image |
Im just wondering how I could go about doing this in my css style sheet I want to set an image to stretch to the full size of my header whatever the header size may be. The image is a gradient png photo and I want it as the background behind my header text. I am new to css, xhtml, however easy it is, I dont know how to do everything As well I want to know, what is the compatability of text shadows? |
Author: | ProgrammingFun [ Wed Oct 05, 2011 4:44 pm ] | ||||
Post subject: | RE:CSS -> Header Background Image | ||||
It's really recommended that you have fixed (at least width) header otherwise, it may end up looking like crap. Therefore, something like this:
As for text shadows, a Google search produced the following site (pretty good): http://www.kremalicious.com/2008/04/make-cool-and-clever-text-effects-with-css-text-shadow/ |
Author: | Tony [ Wed Oct 05, 2011 5:54 pm ] |
Post subject: | RE:CSS -> Header Background Image |
if it's a simple enough gradient, you can have it implemented in pure CSS3 (no images). |
Author: | Zren [ Wed Oct 05, 2011 10:18 pm ] |
Post subject: | RE:CSS -> Header Background Image |
If you want a backwards compatible, and fast loading version. Draw the vertical gradient in a image editor. Then shrink the width to 1px. Then use: background: url(img/gradient.png) repeat-x; height: ___px; Basically it tiles the image only on the x plane. |