The id attribute (ID="T01") translates to "#T01" in CSS.
Note: ids and classes must begin with a letter. IDs must be unique
within a document.
So,
div {...} - Applies to all divs
.foo {...} - Applies to anything with class="foo"
#t01 {...} - Applies to the element identified by id="t01"
div.foo {...} - Applies to all div elements with a class of foo
div#t01 {...} - Applies to the element identified by t01, but only if
it is a div. If t01 identifies any other element, this rule is
ignored.
div.foo#t01 {...} - Applies to the element identified by t01, but only
if it is a div and only is it has a class of foo. If t01 identifies
any other element, or the element does not have foo as a class, this
rule is ignored.
.foo#t0 {...} - Applies to the element identified by t01, but only is
it has a class of foo.
Personally, I would be inclined to write it as:
<div class="inputWidgit" id="t01">
<input ...>
<button ...>
<span class="tag" ...>
</div>
These can them be annotated through CSS as:
.widgit {...} - Style the div itself
.widgit input {...} - Style the input tag
.widgit button {...} - Style the button
.widgit span {...} - Style the span
or
.widgit .tag{...} - Style the element with .tag inside the element
with .widgit
That lets you style all the elements with 4 rules. Then, if you need
to do something specific with, say element t01, you can simply write:
#t01 {...} - Style the element with id="t01"
#t01 input {...} - Style the input tag inside the element with
id="t01"
#t01 button {...} - Style the button inside the element with id="t01"
#t01 span {...} - Style the span inside the element with id="t01"
or
#t01 .tag{...} - Style the element with .tag inside the element with
id="t01"
dcm
On Nov 8, 11:16 am, nmiddleweek <[EMAIL PROTECTED]> wrote:
> Hello,
>
> New here so thanks in advance for everyone's help :)
>
> I've got this page as an example:http://www.getdiverted.com/test/test.html
>
> It has a table grid and within each TD there are 3 main objects with
> DIV containing them. They all have similar ID's.
>
> * div_cWeb_TSW_Day01
> * cWeb_TSW_Day01
> * but_cWeb_TSW_Day01
> * tag_cWeb_TSW_Day01
>
> I've got two questions really:
>
> 1). Is there a better way to organise my naming conventions? I've been
> told on a jQuery forum I can apply a class to the group of objects
> such as CLASS="cWeb_TSW_Day" and use ID to specify the individual
> groups ID="01".
>
> But how do I include the div_, but_ and tag_ bits. Should they go into
> the CLASS name?
>
> 2). I've seen on w3schools that a style called "p.uppercase" will
> apply it's settings to the P elements with a class called uppercase...
> Is there a way to take the extra step and change the style name to
> something like p.uppercase.01 so that it applies it's settings to P
> elements that have a CLASS=uppercase and ID=01 ?
>
> Thanks,
> Nick
--~--~---------~--~----~------------~-------~--~----~
--
You received this because you are subscribed to the "Design the Web with CSS"
at Google groups.
To post: [email protected]
To unsubscribe: [EMAIL PROTECTED]
-~----------~----~----~----~------~----~------~--~---
