css selector as alias of another

[JakDaniel]

is it possible, create a selector as alias of another selector...
(maybe) in another stylesheet file?

ex:

html page
....
<link rel="stylesheet" type="text/css" href="style1.css" />
<link rel="stylesheet" type="text/css" href="style2.css" />
....
<span class="test1">test1</span>
<span class="test2">test2</span>
....

style1.css
....
test1{
font-size: 20px;
}
....

style2.css
....
test2{
# syntax to get style's information from another selector in another
stylesheet (ex: .test in style1.css file)
}
....

another way that I have found is this below...

..test_alias:.test_style{
}

..test_style{
color: #000000;
font-size: 40px;
font-weight: bold;
}

but it don't work... or my syntax is incorrect... you can help me?
thx

[=?ISO-8859-1?Q?Une_B=E9v?==?ISO-8859-1?Q?ue?=]

JakDaniel <ja*********@hotmail.comwrote:

is it possible, create a selector as alias of another selector...
(maybe) in another stylesheet file?

thru Javascript YES

for example u have :

selector1 with rule1

and you want to copy rule1 into selector2
the values for selector1 {rule1} for example :

..test1 {font-size:12px;...}

and you want to copy rule1 "font-size:12px;..." into selector2 ***AS
IF*** you had a stylesheet with :

selctor2 {rule1} for example :

H5.test2 {<same rules as rule1>}

you can do that by javascript DOM mainpulation :

//initialize rule_copy, is (index of the correct sheet):
var rule_copy,is,jr;

// get ref to all the style sheets:
var csss=document.getElementByTagName('style');

//loop over the style sheets:
for(var i=0;i<csss.length;i++) {

//get all the rules for the style sheet i:
var rules=document.styleSheets[i].cssRules;

//loop over the selectors for a given style sheet:
for(var j=0;j<rules.length;j++) {

// catch selector1 (might be better using a RegExp):
if(rules[i]['selectorText'] === '.test1') {

//save the rule for that selector :
rule_copy=rules[i]['cssText'];

//save index of style sheet:
ir=i;
}
}

// now you're are ready to insert a new rule with selector2 having the
// cssText equal to the one of selector1 :
var aRule=selector2+"{"+rule_copy+"}";
document.styleSheets[ir].insertRule(aRule,document.styleSheets[ir]..leng
th);

>>NOT TESTED BUT SHOULD WORK <<<

give me a more precise example, i'll do a page to test that.
--
Une Bévue

[Randy Webb]

Une Bévue said the following on 3/28/2007 1:30 PM:

JakDaniel <ja*********@hotmail.comwrote:

>is it possible, create a selector as alias of another selector...
(maybe) in another stylesheet file?

<snip>

Note the "stylesheet file"

// get ref to all the style sheets:
var csss=document.getElementByTagName('style');

That will miss external files as they are not included using a style
tag, they are included using a link tag.

--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq/index.html
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/

[=?ISO-8859-1?Q?Une_B=E9v?==?ISO-8859-1?Q?ue?=]

Randy Webb <Hi************@aol.comwrote:

>
Note the "stylesheet file"

// get ref to all the style sheets:
var csss=document.getElementByTagName('style');

That will miss external files as they are not included using a style
tag, they are included using a link tag.

Thanks, you are RIGHT ! ;-)

in fact I'm using "document.styleSheets" rather than
"document.getElementByTagName('style')"

I've done a test page here :

<http://www.une-bevue.fr/CSS/copy_rule.xhtml>

It's "a bit" more complicated as i wrotre before...

i wrote two cases :

- 1 - Copy rule of selector "h1.test"
where the whole properties of selector "h1.test" are copied, including
the computed ones.

- 2 - Copy rule property "font-size" of selector "p.sized"
where the only property "font-size" of selector "p.sized" is copied.

In hope my test case (tested ONLY using Firefox 2.0.0.3) is clear
enough.
--
Une Bévue