Re: Trying to learn CSS

by "Billy Dean" <billy61(at)earthlink.net>

Date:	Tue, 8 Jul 2003 11:37:00 -0700
To:	"Wanda J. Hall" <wanda(at)wandaweb.com>, "HWG Techniques" <hwg-techniques(at)hwg.org>
References:	wandaweb
	todo: View Thread, Original

Wanda,

You must tell the body tag, and each paragraph tag, what class you are
invoking, and you must separate the style parameters with semicolons, like
this...

.background
{
background-color: #000000;
background-image: url("bgimage.gif");
background-attachment: fixed;
background-position: 0% 0%;
background-repeat: repeat;
}

p.white
{
color: white;
margin-top: 350px;
margin-left: 150px;
}

p.black
{
margin-top: 350px;
margin-left: 65px;
color: black;
}


<html>
<head>
<title>CSS Test for Empire</title>
<link rel="stylesheet" type="text/css" href="empire.css" />
</head>
<body class="background">
<p class="black">This is black-text paragraph 1</p>
<p class="white">This is white text paragraph 2</p>


</body>
</html>

Are you aware that you can position page elements with the
position:absolute; and position:relative tags rather than use margin tags as
a positioning tool?

Billy Dean
'98 XV1100
billy61(at)earthlink.net
http://www.qwertyarrow.com/virago.htm
"Don't give me no plastic saddle -- I want to feel that leather when I
ride..."

----- Original Message -----
From: "Wanda J. Hall" <wanda(at)wandaweb.com>
To: "HWG Techniques" <hwg-techniques(at)hwg.org>
Sent: Tuesday, July 08, 2003 7:51 AM
Subject: Trying to learn CSS


> I'm attempting to create an external style sheet... I don't seem to be
> getting very far.  I began with just a few elements to see if I was doing
it
> right, but it shows up as a regular white page, with the two lines at the
> top, one below the other as normal paragraphs.  Perhaps someone can set me
> straight before I get too far.  What I'm going for is a black background
> that is filled with a background image.  Two paragraphs that start at
350px
> from the top, the left side paragraph offset from the left with black text
> and another paragraph to the right of it with white text.  This is what I
> have in the .css file:
>
> background
> {
> background-color: #000000
> background-image: url("bgimage.gif")
> background-attachment: fixed
> background-position: 0% 0%
> background-repeat: repeat
> }
>
> p.white
> {
> color: white
> margin-top: 350px
> margin-left: 150px
> }
>
> p.black
> {
> margin-top: 350px
> margin-left: 65px
> color: (black)
> }
>
> This is the html test file:
>
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
>
> <html>
> <head>
> <title>CSS Test for Empire</title>
> <link rel="stylesheet" type="text/css" href="empire.css" />
> </head>
> <body>
> <p.black>This is paragraph 1</p>
> <p.white>This is paragraph 2</p>
>
>
> </body>
> </html>
>
>
> -Wanda J. Hall
>
>

HWG hwg-techniques mailing list archives, maintained by Webmasters @ IWA