|
|
Posted by Wombatwal on 08/29/06 22:48
Thanks all, that is a great help. The logo is content, will probably have to
put it on each page.
Bruce
"Andy Dingley" <dingbat@codesmiths.com> wrote in message
news:1156871461.613738.141060@i3g2000cwc.googlegroups.com...
>
> Wombatwal wrote:
>
>> I have a logo in the form of a small jpeg image.
>> How do I code that into my css page so it will appear on every page.
>
> First of all, ask yourself what this thing is. Is it content or
> wallpaper? When you print it, would you want it printed or ignored ?
> (by default)
>
> If it's content, then it goes into the HTML with an <img> You can add
> alt and title attributes too - it's important _content_, so they'll be
> easy.
>
>
> If it's eye-candy, then you can use CSS and the background-image
> property. Remember to set an appropriate background-color too, in case
> the image fails to load or is turned off by the user.
>
> Look at any CSS reference for the gory details. I suggest the W3C spec,
> because it's not too bad to read so long as you know where to start!
> (trying to _find_ things in there is hard). url() causes trouble to
> lots of people, so begin by placing your HTML page, your CSS and your
> images all in the same directory. Set the repeat properties too, which
> will probably not repeat if it's a "logo" rather than pure background.
>
> As to the HTML, then place the logo into a <div> and give the div an id
> or class attribute (or both) of "logo". Repeat this onto every page,
> with your editor's cut & paste feature (it's easier than SSI).
>
> Use a CSS class selector of .logo {} to apply the CSS to the <div>.
> This is generally easier than using id as a selector, when you start
> having lots of CSS selectors that need to work together,
>
> Set height and width properties on it too, as well as background-image.
> Remember that CSS doesn't see background images as significant enough
> to warrant wasting screen space on, unless there's some content to show
> and you tell it how big to make it. Many people would place a
> (non-breaking space) into the HTML, just so that the <div> doesn't get
> lost or stripped out.
>
Navigation:
[Reply to this message]
|