Define new Colors

[Ungi]

Hey all!

I have a (i think newbie-)problem.

I want to make something like that:

I need to define new Colors with CSS. And those new colors have to be used in the CSS some times later.

I tried it but I had no success, but perhaps someone of you could help me on it. Here is my CSS:

.ColorG {#10FF10}
.ColorR {#FF1010}
.ColorB {#1010FF}

.StrokeG {stroke:.ColorG;stroke-width:10}
.StrokeR {stroke:.ColorR;stroke-width:10}
.StrokeB {stroke:.ColorB;stroke-width:10}

.FillG {fill:.ColorG}
.FillR {fill:.ColorR}
.FillB {fill:.ColorB}

I hope you understand my problem and could help me.

[Lister14]

try this:

.ColorG {color: #10ff10}
...

.StrokeG {width: 10;
color: #10ff10}
...

the problem is that what you tried is a good idea but css doesn't quite work that way...
...it's not necessary to create a class for colour as you can define the colour in p, h1, h2,... (all elements)

you might wanna read something clear and simple on css first like http://www.brainjar.com

it'll tell you about div/class/...

[Ungi]

Thank you for your reply!

My problem is, that I really want to work with central resources (defined once and used many times). And in this context I also want to define a color for one time and use it many times more. But there are other resources that use those colors (strokes, fills and fonts).

So there is my question: is there a possibility to achive this or do I really have to write each color for many times in the stylesheet. (If so, I think it is a big failure in the definition of CSS, because if I want to change a Color resource I have to change all instances in each stroke. Another problem: What if I have to Resources with different names but the same values. How should I know if this stroke references to the color resource I want to change and not to another that has only the same value)

Please help me on the problem...

[Lister14]

I said it before and I'll say it again, I don't think that you have fully understood the concept of CSS.

You can define a colour for a whole page for instance and all of the page e.g. font,... will be using that colour (could you please define what you mean with strokes and fills?). If you want a couple of them things to be different you'll define a class with a different colour and call this when needed...

Maybe some more reading allows you to understand the bigger picture:

http://www.w3schools.com/css/
http://www.htmlgoodies.com/tutors/ie_style.html#style
http://www.webmasterbase.com/subcats/70
http://www.mako4css.com/

ps: I'm not saying that CSS is perfect, but for design and layout (which should be seperated from the content) you should really let go of <table>, <font>, and other annoying tags...

[redux]

lister, although it's true that Ungi has got the syntax wrong, the question he raises is quite accurate actually...

what Ungi is asking is perfectly valid...defining a certain hex value once, and then referencing to that value in other class definitions etc.

unfortunately, from what i know about CSS (and i'm not claiming my knowledge covers everything here), this can't be done. each colour value etc needs to be explicitly written out. interestingly enough, Ungi, i really miss such a feature, as it would make life a hell of a lot easier

[redux]

Originally posted by Lister14
(could you please define what you mean with strokes and fills?)

stroke = border
fill = background colour

[TheOriginalH]

With a little lateral thinking and a sprinkling of .php (or language of taste), the above is utterly achievable

[Ungi]

Thank you all for your answers!!

Too bad, that this methode doesn't work.

I should develope a tool that converts pictures that work with central resources (Colors, Strokes, Fills and Fonts; where strokes have colors and so on) into svg (Scaleable Vector Graphics). To achive such central resources I want to use CSS but too bad, it doesnt work I want.

Does anybody know another method to achive something like that?

[jofa]

Hmmm, I think I understand what you are trying to do

When you set color properties you can use values like #000000, #c0c0c0, #808080 etc, but also color names like Black, Silver, Gray etc(there are only 16 valid color names)

Is it possible to extend this list of color names
I.e. define MyColor as #10ff10 ???

[TheOriginalH]

Originally posted by jofa
Hmmm, I think I understand what you are trying to do

When you set color properties you can use values like #000000, #c0c0c0, #808080 etc, but also color names like Black, Silver, Gray etc(there are only 16 valid color names)

Is it possible to extend this list of color names
I.e. define MyColor as #10ff10 ???

No, it is not .

However, as I said, you can get round this to a certain extent.

<?php

$colour1="#015281";
$colour2="#055616";
$colour3="#046625";

/* Caveat - they were randomly typed - haven't a clue what they are */

?>
<html>
<head>
<title>Test colour scheme</title>
<style type="text/css">
<!--
p {color: <? echo"$colour1"; ?>}
h1 {color: <? echo"$colour2"; ?>}
-->
</style>

<!-- Yada yada yada -->
<body>
<h1>Yep</h1>
<p>Whatever</p>
</body>
</html>

Would be one way (but involves un-needed code transfer). You could also write a script that writes the values to a STATIC .css file. In fact it could be a fun project

[Ungi]

Yes exactly that is what I want!!

[Lister14]

Thanks H, I see you got the .php-power to solve the issue...

Greetings to Austria Ungi, hope you've got some snow...

[jofa]

Originally posted by TheOriginalH
No, it is not

Not even if you define a new DTD?

[TheOriginalH]

Good question, and beyond my scope. With .css I believe the answer would still be a straight no. But with xslt etc, I really don't know enough. Would be very nifty if ya can

[jofa]

Yep
I mean, Black, Silver, Gray etc must be defined somewhere

[Ungi]

Originally posted by Lister14
Greetings to Austria Ungi, hope you've got some snow...

Yes we have, but I heard that at XMas we will get 10°C

But on the mountains there will be more than enough!