[css] Variabele

[Brabrabra]

Ik heb een grote css file, waarin ik bijvoorbeeld de kleuren van dingen op de bijbehorende site in heb staan. Ik gebruik alleen maar 3 of 4 verschillende kleuren, die ik door de hele file door elkaar heb staan. Is er een mogelijkheid dat ik bovenaan zoiets als variabelen kan zetten?:

kleur1: '#E3E8F9';
kleur2: '#CCCEE4';
kleur3: '#CCBEE3';

En dan door de hele file heen gewoon kleur1, kleur2 en kleur3 gebruiken, zodat ik als ik een van die kleuren wil veranderen het gewoon alleen bovenaan hoef te doen.

Ik heb al gedacht dat met PHP te doen, maar in een CSS file kan volgens mij geen PHP, dus die valt al af.

[Erkens]

waarom kan je php geen css laten creeeren
het is gewoon een plain ascii file, die kan je zo uitpoepen met php

[cybermans]

volgens mij kan je rustig een php file gebruiken als linked file

[Sybr_E-N]

Zoiets?

.kleur1 {font-family:Arial, Helvetica, sans-serif; font-size:10; color:#000000;}
.kleur2 {font-family:Arial, Helvetica, sans-serif; font-size:10; color:#999999;}

en aanroepen in je HTML:
<DIV CLASS="kleur1">endanhierjetxtenzo</DIV>

^{http://www.w3.org}

[Brabrabra]

Ik heb de .css file gerenamed naar .php en nu paktie de PHP wel en de CSS ook nog. Ik wist niet dat CSS ook werkte in files die niet .css heten

Hmmm nou bedenk ik me dat het eigenlijk wel logisch is dat het wel kan, stom



Bedankt voor jullie reacties, scheelt me een hoop werk dat ik het nu allemaal in een paar vars kan zetten.

[Brabrabra]

Nou ik toch bezig ben:
Weet iemand of je de kleur van het lijntje van underline ook een andere kleur kan geven dan de text zelf?

[Sybr_E-N]

Sybr_E-N schreef op 07 March 2003 @ 21:50:

^{http://www.w3.org}

Hier staan alle specificaties op het gebied van HTML en CSS. Ook staan er handige voorbeelden.

[Verwijderd]

Brabrabra schreef op 07 March 2003 @ 21:56:
Ik heb de .css file gerenamed naar .php en nu paktie de PHP wel en de CSS ook nog. Ik wist niet dat CSS ook werkte in files die niet .css heten

Hmmm nou bedenk ik me dat het eigenlijk wel logisch is dat het wel kan, stom



Bedankt voor jullie reacties, scheelt me een hoop werk dat ik het nu allemaal in een paar vars kan zetten.

Wel even de text/css Content-Type header meegeven voor de zekerheid, anders pakken sommige browsers het misschien niet.

Op lists.w3.org heb ik weleens iets gelezen over variabelen binnen CSS, maar volgens mij zit dat er niet echt in. Voor meer geavanceerde opties zul je in de toekomst misschien eerder naar XSLT en XSL-FO grijpen.

Of CSS3 echt in die richting za evolueren durf ik nog niet te zeggen.

[cybermans]

op http://www.w3schools.com/css/default.asp staat ook een heleboel over css

[Glimi]

Mensen met verstand van CSS (zodat deze discussie goed gevoerd kan worden) zitten in W&G Vandaar dat ik dit topic daar even neerzet

[Dark Blue]

Brabrabra schreef op 07 March 2003 @ 21:57:
Nou ik toch bezig ben:
Weet iemand of je de kleur van het lijntje van underline ook een andere kleur kan geven dan de text zelf?

Het is me een keer gelukt, op een hele gore manier... dwz. niet netjes.

Ik geloof dat je text binnen een <span> moest zetten, die span een textkleur geven... en vervolgens daaromheen, of daarin, weer een link moest maken, die je een andere kleur gaf en hem liet underlinen... ff kijken of ik het nog kan vinden (vroeger spaarde ik dat soort codetjes)

code:

<font size="2" color="red">
<u><span style="color: green">
Een vlieg zonder vleugels noem je een loop.
</span></u>
</font>

[ Voor 8% gewijzigd door Dark Blue op 07-03-2003 23:02 ]

[Brabrabra]

Dark Blue schreef op 07 March 2003 @ 23:02:
[...]

code:

<font size="2" color="red">
<u><span style="color: green">
Een vlieg zonder vleugels noem je een loop.
</span></u>
</font>

Dit werkt niet als je et <a href=""> ... </a> omheen zet En ik wil het gebruiken voor links.

Maar wel leuk om eens een andere keer te gebruiken

[ Voor 23% gewijzigd door Brabrabra op 07-03-2003 23:19 ]

[Verwijderd]

Misschien gewoon een css-declaratie aanroepen? border-bottom: 1px solid green;
Is wel niet helemaal hetzelfde.

[Blaise]

Scheelt bij een kleine lettergrootte maar 1 pixel (underline en border-bottom).
Je kan ook nog wat expirimenteren met negatieve verticale positionering van (alle) tekst zodat die dichter bij de border-bottom staat.

[ Voor 5% gewijzigd door Blaise op 08-03-2003 00:51 ]

[Brabrabra]

Als ik de positie van de text verandere met bijv. text-decoration:none; position:relative; top:-1px; schuift dat lijntje gewoon mee, dus daarmee kan ik het lijntje niet dichterbij de text krijgen.

[cybermans]

* cybermans edit ff want zit nog met mijn hoofd bij gisteren

[ Voor 81% gewijzigd door cybermans op 08-03-2003 10:25 ]

[edwinistrator]

Brabrabra schreef op 07 March 2003 @ 23:18:
[...]

Dit werkt niet als je et <a href=""> ... </a> omheen zet En ik wil het gebruiken voor links.

Maar wel leuk om eens een andere keer te gebruiken

dat moet dus dit zijn:

code:

<html>
<head>
<style>
a
    {
    color: red;
    }
.underline
    {
    color: blue;
    }
</style>
</head>
<body>
<a href="#"><span class="underline">linkje</span></a>
</body>
</html>

[2]

Brabrabra schreef op 07 maart 2003 @ 21:46:
Ik heb een grote css file, waarin ik bijvoorbeeld de kleuren van dingen op de bijbehorende site in heb staan. Ik gebruik alleen maar 3 of 4 verschillende kleuren, die ik door de hele file door elkaar heb staan. Is er een mogelijkheid dat ik bovenaan zoiets als variabelen kan zetten?:

kleur1: '#E3E8F9';
kleur2: '#CCCEE4';
kleur3: '#CCBEE3';

En dan door de hele file heen gewoon kleur1, kleur2 en kleur3 gebruiken, zodat ik als ik een van die kleuren wil veranderen het gewoon alleen bovenaan hoef te doen.

Ik heb al gedacht dat met PHP te doen, maar in een CSS file kan volgens mij geen PHP, dus die valt al af.

De beste oplossing is hier niet een PHP script maar Find & Replace.

[Clay]

ooit gedacht aan:

code:

.content {
   font:9pt arial;
}

.regular {
   color:gray;
}

...

<span class="content regular">hoi</span>

? dan staan je kleuren ook op 1 plek.