Connecting Tech Pros Worldwide Forums | Help | Site Map

basic question about CSS

soni2926@yahoo.com
Guest
 
Posts: n/a
#1: Oct 24 '08
hi,
what's the difference between using . or #?

#switcher {
....
}

..chapter {
.....
}

is it preference, or the refer to different things?

Ben Bacarisse
Guest
 
Posts: n/a
#2: Oct 24 '08

re: basic question about CSS


soni2926@yahoo.com writes:
Quote:
hi,
what's the difference between using . or #?
>
#switcher {
...
}
>
.chapter {
.....
}
>
is it preference, or the refer to different things?
They are selectors that match element using quite different criteria.
The first matches an element with id "switcher" (there can be only one
per document). The second matches any element that has "chapter" in
its class attribute.

I don't mean to be rude, but this is a rather basic question and
learning CSS by asking in a Usenet group is not likely to be very
productive. You need a good book or tutorial. If you get on well
with formal documents you can read it from the horse's mouth:

http://www.w3.org/TR/2007/CR-CSS21-20070719/ and specifically
http://www.w3.org/TR/2007/CR-CSS21-2.../selector.html

--
Ben.
dorayme
Guest
 
Posts: n/a
#3: Oct 24 '08

re: basic question about CSS


In article <87skqmx8rz.fsf@bsb.me.uk>,
Ben Bacarisse <ben.usenet@bsb.me.ukwrote:
Quote:
soni2926@yahoo.com writes:
>
Quote:
hi,
what's the difference between using . or #?

#switcher {
...
}

.chapter {
.....
}

is it preference, or the refer to different things?
>
They are selectors that match element using quite different criteria.
The first matches an element with id "switcher" (there can be only one
per document). The second matches any element that has "chapter" in
its class attribute.
>
I don't mean to be rude, but this is a rather basic question and
learning CSS by asking in a Usenet group is not likely to be very
productive. You need a good book or tutorial. If you get on well
with formal documents you can read it from the horse's mouth:
>
http://www.w3.org/TR/2007/CR-CSS21-20070719/ and specifically
http://www.w3.org/TR/2007/CR-CSS21-2.../selector.html
And if you don't, try

<http://www.htmldog.com/guides/htmlbeginner/>

--
dorayme
liketofindoutwhy
Guest
 
Posts: n/a
#4: Oct 25 '08

re: basic question about CSS


and 2 of the good books i read about CSS are:

CSS Mastery by Andy Budd
and CSS the Missing Manual

HTMLDog seems quite good. i didn't understand why it suggested using
border: 0... i thought it would be better if it is border: none.
margin: 0 is a better example of use 0 without any unit.

dorayme
Guest
 
Posts: n/a
#5: Oct 25 '08

re: basic question about CSS


In article
<1d754bb8-d571-4b01-aec9-f3f6d56ad777@v22g2000pro.googlegroups.com>,
liketofindoutwhy <liketofindoutwhy@gmail.comwrote:
Quote:
HTMLDog seems quite good. i didn't understand why it suggested using
border: 0... i thought it would be better if it is border: none.
border: 0; is better because it is shorter. Surely that is sufficient
reason?

Perhaps a bigger mystery is why it uses XHTML instead of HTML. Perhaps
because people will think it old hat otherwise? <g>

--
dorayme
Johannes Koch
Guest
 
Posts: n/a
#6: Oct 25 '08

re: basic question about CSS


liketofindoutwhy schrieb:
Quote:
HTMLDog seems quite good. i didn't understand why it suggested using
border: 0... i thought it would be better if it is border: none.
'border: 0' sets another property (border-width) than 'border: none'
(border-type). Both are covered by the 'border' shorthand.

--
Johannes Koch
In te domine speravi; non confundar in aeternum.
(Te Deum, 4th cent.)
Jukka K. Korpela
Guest
 
Posts: n/a
#7: Oct 25 '08

re: basic question about CSS


Johannes Koch wrote:
Quote:
liketofindoutwhy schrieb:
>
Quote:
>HTMLDog seems quite good. i didn't understand why it suggested using
>border: 0... i thought it would be better if it is border: none.
>
'border: 0' sets another property (border-width) than 'border: none'
(border-type). Both are covered by the 'border' shorthand.
Actually, they set exactly the same _properties_, though to different
_values_.

border: 0 by definition sets
border-width to 0
border-style to none
border-color to content color of the element

border: none by definition sets
border-width to medium
border-style to none
border-color to content color of the element

Thus, they are _not_ equivalent, even though they _often_ have the same
effect. Of course, they both imply just that no border appears _if_ no other
style sheet is applied. However, if no other style sheet is applied,
border-style is none anyway, as that's the initial value as defined in CSS
specifications!

If you later set, for example, border-style: solid for the element, then no
border appears if you had first set border: 0 (since border width is still
zero). But if you had first set border: none, then you will see a solid
border of width medium (typically 4 pixels) with the element's content
color.

Rules for using "shorthand notations" (like border and font) in CSS:

1. If you don't really understand them, don't use them.

2. If you really understand them, you don't need my advice to stay away from
them. :-)

--
Yucca, http://www.cs.tut.fi/~jkorpela/

Closed Thread


Similar HTML / CSS bytes