Posted by
leiger on 1257122179|%A, %e %B %Y, %H:%M
What is the difference between .selector, #selector and selector? I'm always guessing at which one to use.
Thanks to the contributions of Ed Johnson and Steven Heynderickx, I have an answer.
selector is called a Type selector. These generally refer to site-wide HTML elements like <a …>…</a>, <body>…</body>, <h1>…</h1>, <h2>…</h2>, <table>…</table>, etc.
.selector is called a Class selector. These are used to apply the class to an element like <table class="mytablestyle">…</table>.
#selector is called an ID selector. These are used to apply styles to DIVs that are given an id attribute like <div id="mydiv">…</div>.
Here's some specific examples from some Wikidot HTML sources and corresponding CSS:
| HTML Source | Selectors | Related CSS |
| <blockquote> <p>Could you take a second to review <a href="http://blog.wikidot.com/design:2">http://blog.wikidot.com/design:2</a> and make sure it gives you what you need? Thanks.</p> </blockquote> |
blockquote, p, a |
blockquote{ border: 1px dashed #999; padding: 0 1em; background-color: #f4f4f4; } a{ color: #00A; } p{ font-family: verdana,arial,helvetica,sans-serif; } |
| <div class="gallery-box"> | .gallery-box |
.gallery-box{ overflow: hidden; width: 98%; } |
| <div id="side-bar"> | #side-bar |
#side-bar{ float: left; width: 14em; padding: 1em; margin: 0 0 1em 0; clear: left; } |






