some VERY basic questions about CSS syntax

Dev Shed Forums Sponsor:

March 22nd, 2004, 10:17 AM

lauras2003

Contributing User

Join Date: Mar 2003

Posts: 83

Time spent in forums: 1 h 49 m 37 sec
Reputation Power: 6

some VERY basic questions about CSS syntax

Hi all,

What does this mean?

H1 A:link { color:#fff }

- or -

.sectionhead H2 { font-size: 12px; }

I'm asking specifically about the space between the name of the selector and the HTML tag reference. What function does that space have? If it were a comma I would know, but I don't know what a space means. Sorry if totally dumb question.

Also, I keep seeing three-character hex values (e.g., #fff, #0cd, #078, etc). How are they used, what do they mean? I would have thought it meant to repeat the three characters to make the six (eg, #ffffff, #0cd0cd, #078078) but that appears not to be the case.

I've been looking around w3schools.org to find answers to questions like these, but no luck. Any suggestions?

Thanks to anybody who takes the time to answer!

Laura S.

March 22nd, 2004, 11:28 AM

lauras2003

Contributing User

Join Date: Mar 2003

Posts: 83

Time spent in forums: 1 h 49 m 37 sec
Reputation Power: 6

To elaborate my first question further, what does THIS mean?

TR TD.someNav A:link, TR TD.someNav A:visited { text-decoration: none;}

Thanks again,
Laura S.

March 22nd, 2004, 02:31 PM

atomgiant

Registered User

Join Date: Mar 2004

Posts: 3

Time spent in forums: < 1 sec
Reputation Power: 0

The space allows you to be more specific when matching. For instance:

a:link {color: #fff;}

will match on *all* <a> tags

h1 a:link {color: #fff;}

will only match on <a> tags that are nested within <h1> tags, such as

<h1>This is a Title <a href="nowhere.com">This is a Link In a Title</a></h1>

Here is a useful reference for this sort of thing:

URL

Also, this site is an excellent reference of examples and resources if you haven't checked it out:

URL

Good luck,
---atomgiant

March 22nd, 2004, 02:43 PM

lauras2003

Contributing User

Join Date: Mar 2003

Posts: 83

Time spent in forums: 1 h 49 m 37 sec
Reputation Power: 6

Thank you, that totally makes sense once I hear it from someone else.

That leaves my other question about the 3 character color references -- the only two obvious possibilities are:

1) #123 ==> #123123

or...

2) #123 ==> #112233

but neither of these seems to be the case. I've tested both cases and in neither case is the six digit code equivalent to the 3 digit code.

Please help because I'm sure the answer is trivial and I'm spending too much time on it!!!

Thanks again.

Laura S.

March 22nd, 2004, 03:07 PM

atomgiant

Registered User

Join Date: Mar 2004

Posts: 3

Time spent in forums: < 1 sec
Reputation Power: 0

The second one is correct. Here is a thread I found that discusses it:

URL

March 23rd, 2004, 08:41 AM

lauras2003

Contributing User

Join Date: Mar 2003

Posts: 83

Time spent in forums: 1 h 49 m 37 sec
Reputation Power: 6

Ah, right. I was testing this using the html <body> tag and using a bgcolor of "abc" vs "aabbcc" and the colors were completely different! But if I style the background-color of the page using CSS, then the two versions of coding the color are the same.

Silly me ...

Thanks for the help.

Laura S.

Thread Tools	Search this Thread
Email this Page	Search this Thread: Advanced Search
Display Modes	Rate This Thread
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode	Rate This Thread: