By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
443,433 Members | 771 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 443,433 IT Pros & Developers. It's quick & easy.

apply multiple styles

P: n/a
hi,

it is possible to apply multiple styles as shown in the following
example.

<STYLE TYPE="text/css"><!--

BODY { background-color:salmon; }
P { margin-left:20px; }
.clsCode { font-family:"Comic Sans MS"; font-size:10pt; color:navy;}
#idP1 { text-align:left; font-weight:bold; }

--></STYLE>

<P ID="idP1" CLASS="clsCode">Multiple styles</P>

however, i would like to apply multiple styles in this manner with
scripting. i want to assign a style class and apply another along with
the previous one. how can i achieve this? what is the best approach for
IE 6? are there any w3c standards that makes applying multiple styles
possible?

is it possible to assign multiple selectors to class attribute?
<P CLASS="clsCode1, clsCode2">Multiple styles</P>

is it possible to nest selectors within them?

.clsCode1 { font-family:"Comic Sans MS"; font-size:10pt; }
.clsCode2 { clsCode1; color:navy;}

thanks.

Aug 4 '06 #1
Share this Question
Share on Google+
3 Replies


P: n/a
spolsky wrote:
<P CLASS="clsCode1, clsCode2">Multiple styles</P>
I don't know is it standard, but it works as the following:
<P CLASS="clsCode1 clsCode2">Multiple styles</P>
is it possible to nest selectors within them?
.clsCode1 { font-family:"Comic Sans MS"; font-size:10pt; }
.clsCode2 { clsCode1; color:navy;}
I don't know there is any way to do so...

Aug 4 '06 #2

P: n/a
spolsky wrote:
hi,

it is possible to apply multiple styles as shown in the following
example.
Yes.

<STYLE TYPE="text/css"><!--
Do not use HTML comment delimiters inside style elements.

BODY { background-color:salmon; }
P { margin-left:20px; }
.clsCode { font-family:"Comic Sans MS"; font-size:10pt; color:navy;}
#idP1 { text-align:left; font-weight:bold; }

--></STYLE>

<P ID="idP1" CLASS="clsCode">Multiple styles</P>

however, i would like to apply multiple styles in this manner with
scripting. i want to assign a style class and apply another along with
the previous one. how can i achieve this?
elementReference.className = 'aClass';
elementReference.className += ' anotherClass';

what is the best approach for IE 6?
The W3C standards compliant way - see above.

are there any w3c standards that makes applying multiple styles
possible?
Yes:

<URL: http://www.w3.org/TR/CSS21/ >
<URL: http://www.w3.org/TR/DOM-Level-2-Style/ >

is it possible to assign multiple selectors to class attribute?
<P CLASS="clsCode1, clsCode2">Multiple styles</P>
Yes, but lose the comma - class names are separated by spaces:

<P CLASS="clsCode1 clsCode2">Multiple styles</P>

is it possible to nest selectors within them?

.clsCode1 { font-family:"Comic Sans MS"; font-size:10pt; }
.clsCode2 { clsCode1; color:navy;}
The rules for how selectors and rules cascade is contained in the spec
(see above). You really should ask such questions in a CSS news group:

news: comp.infosystems.www.authoring.stylesheets
<URL:
http://groups.google.com.au/group/co...s?lnk=li&hl=en
>

--
Rob

Aug 4 '06 #3

P: n/a
hi,

RobG:
elementReference.className = 'aClass';
elementReference.className += ' anotherClass';
this is ok, but what if some other script already assigns its own
classes. in this case, it would be possible to track our classes in the
className attribute(by searching in the string) and remove or add them
accordingly but isn't there any flexible approach? it would be better
if className is a collection that we could determine easily if required
classes are applied or not.
or is there any better approach to apply our multiple classes without
depending on other scripts on the page?

Aug 5 '06 #4

This discussion thread is closed

Replies have been disabled for this discussion.