TC wrote:
>> Last time I checked, there are two ways to put an image into a web page. 
>> You can use the IMG tag, which inserts an image in amoungst the text.
> 
> You have to use CSS.

Yeah, one way is to use IMG tags in the HTML, the other way is the 
background property in CSS.

Besides, ideally your HTML should contain *only* the text you're trying 
to display, and CSS should do all the styling. A while back I found this:

http://www.csszengarden.com/

Just by changing the CSS, it completely rearranges the entire contents 
of the page. And I thought CSS was just for changing colours...

> There is a css-property called z-index, allowing you to 
> stack elements that have this property.

Yeah, I remember reading about that. I didn't think any known browser 
supported it though?

Oh, mind you, I guess that was a while ago...

> There are "left", "right", "top", 
> "bottom" properties, allowing you to position elements with pixel-precision.

Yeah, I've played with them, but I could never think of any useful 
purpose for them.

> Note the "position" properties. They are important - read up on them.

Yeah, you can set the position relative to the rest of the flow, or 
absolute relative to the page, or relative to the browser frame, or...

> Then you have a several css-properties for background: you can layer 
> div-elements one upon the other, and overlap them using "left", "top", 
> etc. - and each div-element can have a seperate background. The background 
> for each and every element can be aligned ("background-align" property) and 
> you can decide whether you want to repeat it or not. So you can position an 
> image within a div-element and have a backgound for this element. If the 
> background is a transparent image, the images and text below will show 
> through.

Now, see, I was under the impression that setting a background 
completely overrides any previous setting. And yet here we have a page 
with a stipey background, and then a glow background on top of that. Or 
DIV boxes with a transparent background so what's below shows through 
(rather than being replaced).

> There are pitfalls, though. Not every browser supports css properly and you 
> have to make sure the browser is in the right mode.

Sure, you need to avoid quirks mode and stuff, and as soon as you use 
CSS it's 100% guaranteed that it will only ever work in the one version 
of the one browser you tested with. I get that.

> It can be very hard to debug a style.

Hell yeah. Almost as hard as trying to debug JavaScript...

> If you really want to dig into this, you have to learn how css works.

I already know how CSS works. What I seem to be missing is that since I 
last looked at it, they've added some new features.

> For a background that goes from one colour to another you can use your 
> paint-program, create a line with fill-properties starting at blue and 
> ending at white. Then put this 1-pixel line in the background property of 
> your [whatever div or document part you want it to be].

Sure. I get that. (Although I don't possess a "paint program" to create 
this image with in the first place... I'd have to write a custom program 
to generate the pixels and write them to file, which is a little tedious.)

Post a reply to this message