OutFront Forums
     Home    Register     Search      Help      Login    

Sponsors
Frontpage website templates
Creative Website Templates for FrontPage, Dreamweaver, Flash, SwishMax
Shopping Cart Software
Ecommerce software integrated into Frontpage, Dreamweaver and Golive templates. No monthly fees and available in ASP and PHP versions.
Website Templates
We also have a wide selection of Dreamweaver, Expression Web and Frontpage templates as well as webmaster tools and CSS layouts.

Follow Us
On Facebook
On Twitter
RSS
Via Email

Recent Posts
Todays Posts
Most Active posts
Posts since last visit
My Recent Posts
Mark posts read
 

CSS Variables

 
View related threads: (in this forum | in all forums)

Logged in as: Guest
Users viewing this topic: none
Printable Version 

All Forums >> Web Development >> Cascading Style Sheets and Accessibility >> CSS Variables 		Page: [1]
 
 
SerenityNet

 

Posts: 1391
Joined: 6/12/2001
From: Allen, TX, USA
Status: offline

  		CSS Variables - 11/16/2005 9:29:39   
I don't know what else to call them, so I'll use the word variables for the moment.

I thought I saw one time where you could define, at the start of your sheet, things like:
  background-color:#FFFFFF;
  color: #CCCCCC;
Then further down in your sheet, when you want to define a color then you could just reference the "variable" defined at the beginning.

The purpose would be, by just changing the "variables" defined at the beginning, you could effectively change the whole sheet.

Am I having hallucinations or did I really see this somewhere? If so, can someone point me in the right direction?

Thanks,
Andrew

PS. And of course, if I'm not hallucinating, the next question will be, "Can I define the variables in a page and not just on the sheet?"

_____________________________

There are some ideas so preposterous that only an intellectual will believe them. - Malcolm Muggeridge
kopythat

 

Posts: 2
Joined: 11/16/2005
Status: offline

  		RE: CSS Variables - 11/16/2005 9:59:44   
are you meaning as just changing the background of tables, cells (certain areas) or changing the whole style of the page, as in chick here to change the background to blue instead of white, or click here to change all the font colours to red.

or are you meaning something else all together?

Kopy

(in reply to SerenityNet)
SerenityNet

 

Posts: 1391
Joined: 6/12/2001
From: Allen, TX, USA
Status: offline

  		RE: CSS Variables - 11/16/2005 10:54:32   
Something else alltogether.

For instance, in a CSS sheet, I might have "background-color:#FFFFFF;" stated a half-dozen times or more. When I want to change it to #FF0000 then I have to go to each place and change it. I don't want to do that. I just want to change it once, at the top of the CSS sheet.

It's kind of like what I would do with ASP. At the start of the page I would set a variable and then I could use that variable as many times as I wanted throughout the page (or site). Can I do a similar thing with CSS?

Thanks,
Andrew

_____________________________

There are some ideas so preposterous that only an intellectual will believe them. - Malcolm Muggeridge

(in reply to kopythat)
Donkey

 

Posts: 4076
Joined: 11/13/2001
From: Blackfield United Kingdom
Status: offline

  		RE: CSS Variables - 11/16/2005 11:33:05   
Never heard of that but you could try grouping all the "variables" together at the start. i.e.
html,
body,
h1,h2,h3,
p,
container{
background-color:#FFF,
color:#CCC,
}

but as some values are inherited anyway it may not always be necessary if you don't specify a value in the child element.


_____________________________

:)

I have a higher and grander standard of principle than George Washington. He could not lie; I can, but I won't.
Samuel Clemens

(in reply to SerenityNet)
bobby

 

Posts: 11818
Joined: 8/15/1969
From: Seattle WA USA
Status: offline

  		RE: CSS Variables - 11/16/2005 12:03:31   
Nope, can't do that.

You can put your CSS into an "inline" sheet at the top of each .asp page. Then take the whole thing and put it into an include file (so you can still manage it from a single file) and define ASP variables that way...

I've done it before and it works great.

:)

_____________________________

Talk to your kittens about catnip, or someone else will.


:)

(in reply to Donkey)
SerenityNet

 

Posts: 1391
Joined: 6/12/2001
From: Allen, TX, USA
Status: offline

  		RE: CSS Variables - 11/16/2005 12:31:47   
quote:

ORIGINAL: bobby
You can put your CSS into an "inline" sheet at the top of each .asp page. Then take the whole thing and put it into an include file (so you can still manage it from a single file) and define ASP variables that way...


Aaaah, I like that.

Of course that begs the question, "Why doesn't everyone do it that way?" It would allow you to make a template and then change it at will by just re-defining the variables. If you have a customer that wants goldenrod instead of gold then BAM! it's done.

Andrew

_____________________________

There are some ideas so preposterous that only an intellectual will believe them. - Malcolm Muggeridge

(in reply to bobby)
Tailslide

 

Posts: 6755
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline

  		RE: CSS Variables - 11/16/2005 12:52:10   
'xactly - wonderful isn't it!

_____________________________

Little Blue Plane Web Design | Land Rover project

:)

(in reply to SerenityNet)
d a v e

 

Posts: 4413
Joined: 7/24/2002
From: England (but live in Finland now)
Status: offline

  		RE: CSS Variables - 11/16/2005 13:26:27   
quote:

If you have a customer that wants goldenrod...
and who wouldn't want that ;)

_____________________________

David Prescott
Gekko web design

(in reply to Tailslide)
bobby

 

Posts: 11818
Joined: 8/15/1969
From: Seattle WA USA
Status: offline

  		RE: CSS Variables - 11/16/2005 14:27:57   
I used it originally for a script that allowed custom styles... you could even define your own colors and styles and it would save your choices in a database, and in a cookie.

When you came back the site would remember you and your custom style...

:)

_____________________________

Talk to your kittens about catnip, or someone else will.


:)

(in reply to d a v e)
womble

 

Posts: 6265
Joined: 3/14/2005
From: Living on the edge
Status: offline

  		RE: CSS Variables - 11/16/2005 16:39:53   
Are we talking about classes here, or have I misunderstood the question?

You can give each instance of your 'variable' a class, which you define in your stylesheet, and then use the same class however many times you want on the page and change the colour of all by simply changing the color in your stylesheet, either embedded or external.

_____________________________

~~ "A cruel god ain't no god at all" ~~
~~ Erase hate. Practice love. ~~

(in reply to bobby)
bobby

 

Posts: 11818
Joined: 8/15/1969
From: Seattle WA USA
Status: offline

  		RE: CSS Variables - 11/16/2005 18:53:19   
Nope, we're talking about dynamically changing all instances of say #ffffff in your CSS to #000000 with changing a single line of code, rather than going thru the sheet and changing each one...

So if you set a variable... say:

<%vMainColor="#fffff"%>

then in the body of the CSS everywhere you want white as the color you use <%=vMainColor%>

If you change the color in the variable it will reflect throughout the page...


_____________________________

Talk to your kittens about catnip, or someone else will.


:)

(in reply to womble)
rdouglass

 

Posts: 9280
From: Biddeford, ME USA
Status: offline

  		RE: CSS Variables - 11/16/2005 19:19:34   
I never use style.css anymore. I always use style.asp and here's a typical chunk:

.......
body
{
background-color: <%=themeBody%>;
}

.myHeaderBackground:link
{
background-color: <%=themeLinkBackColor%>;
border-top: 1px solid <%=themeSeparatorColor%>;
border-left: 1px solid <%=themeSeparatorColor%>;
border-bottom: 3px solid <%=themeSeparatorColor%>;
border-right: 3px solid <%=themeSeparatorColor%>;
}

.myDarkBackground
{
background-color: <%=themeDarkBackColor%>;
}

.myMedBackground
{
background-color: <%=themeMedBackColor%>;
}

.myLightBackground
{
background-color: <%=themeLightBackColor%>;
}

.myLineColor
{
background-color: <%=themeSeparatorColor%>;
}

.myMainTableColor
{
background-color: <%=themeMainTableColor%>;
}


.....

Is that what you mean?

In fact, one of my Content Management solutions uses this exact thing with a few "themes" in a database with pre-defined color schemes as well as a copy/paste form to build / edit the themes.

_____________________________

Don't take you're eye off your final destination.

ASP Checkbox Function Tutorial.

(in reply to bobby)
SerenityNet

 

Posts: 1391
Joined: 6/12/2001
From: Allen, TX, USA
Status: offline

  		RE: CSS Variables - 11/16/2005 22:49:02   
quote:

Is that what you mean?
Yes! At least what you have illustrated is what I understood when Bobby suggested...
quote:

You can put your CSS into an "inline" sheet at the top of each .asp page. Then take the whole thing and put it into an include file (so you can still manage it from a single file) and define ASP variables that way...

And using this in a Content Management solution is exactly my intention. To date, themes (skins) have always included both layout and color scheme. My question was prompted by my desire to just have a few themes (skins) that govern only layout - then have the color schemes defined as we've described here.

I'm just coming back (a little bit) from a relatively long break from web work.  I thought I recalled that it could be done, but I just couldn't remember how.  (brain cramp)  This thread got me back on track.

Thanks,
Andrew

_____________________________

There are some ideas so preposterous that only an intellectual will believe them. - Malcolm Muggeridge

(in reply to rdouglass)
bobby

 

Posts: 11818
Joined: 8/15/1969
From: Seattle WA USA
Status: offline

  		RE: CSS Variables - 11/17/2005 0:16:19   
exactly

:)

_____________________________

Talk to your kittens about catnip, or someone else will.


:)

(in reply to SerenityNet)
Tailslide

 

Posts: 6755
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: offline

  		RE: CSS Variables - 11/17/2005 5:08:32   
Another thing you can do is to give each page a specific id so that, if as Womble mentions you give each section of the page a different id too then you can be page specific in your external stylesheet.

So you could have: 
#homepage img {float:right;}


or my personal favourite is to give each nav item in the nav menu a different id and then you can refer to it from the CSS stylesheet allowing you to highlight the active nav item etc and then remove all the nav to a seperate include file.

so: 
#homepage #nav-home {color:blue; font-weight:bold;}


or whatever.

I used to put my stylesheet "calls" into an include but it was a PIA for changing stuff locally because there was no style applied. What I do now is to have a link in head section to a stylesheet which then has a @import link to the actual stylesheet. Same end result as having an include - you can swap and change the stylesheet in the linked-to stylesheet without having to go through every page. The added benefit is that NN4 doesn't like @import so it dumps that out leaving it to see a "plain page"

_____________________________

Little Blue Plane Web Design | Land Rover project

:)

(in reply to bobby)
drogers

 

Posts: 142
Joined: 5/7/2004
Status: offline

  		RE: CSS Variables - 1/19/2006 21:31:06   
I know this is an older post, but I had a question.

How/where do you need to insert an asp based "style" sheet? Would you include it as an inline style sheet or as an embedded style sheet? Do you reference it the same way you would a regular style sheet? How is it for positioning of elements?

I know that's a lot of questions, but I have a large, complex piece of web software I'm developing and this kind of on the fly customization is exactly what I need...I think.

(in reply to rdouglass)
dpf

 

Posts: 7121
Joined: 11/12/2003
From: India-napolis
Status: offline

  		RE: CSS Variables - 1/20/2006 6:57:55   
quote:

insert an asp based "style" sheet
define asp based style sheet

_____________________________

Dan

(in reply to drogers)
drogers

 

Posts: 142
Joined: 5/7/2004
Status: offline

  		RE: CSS Variables - 1/20/2006 9:04:38   
From Above:

quote:

ORIGINAL: rdouglass

I never use style.css anymore. I always use style.asp and here's a typical chunk:

.......
body
{
background-color: <%=themeBody%>;
}

.myHeaderBackground:link
{
background-color: <%=themeLinkBackColor%>;
border-top: 1px solid <%=themeSeparatorColor%>;
border-left: 1px solid <%=themeSeparatorColor%>;
border-bottom: 3px solid <%=themeSeparatorColor%>;
border-right: 3px solid <%=themeSeparatorColor%>;
}

.myDarkBackground
{
background-color: <%=themeDarkBackColor%>;
}

.myMedBackground
{
background-color: <%=themeMedBackColor%>;
}

.myLightBackground
{
background-color: <%=themeLightBackColor%>;
}

.myLineColor
{
background-color: <%=themeSeparatorColor%>;
}

.myMainTableColor
{
background-color: <%=themeMainTableColor%>;
}


.....

Is that what you mean?

In fact, one of my Content Management solutions uses this exact thing with a few "themes" in a database with pre-defined color schemes as well as a copy/paste form to build / edit the themes.


(in reply to rdouglass)
drogers

 

Posts: 142
Joined: 5/7/2004
Status: offline

  		RE: CSS Variables - 1/20/2006 9:13:35   
I found this which, I believe answers my question:

http://www.4guysfromrolla.com/webtech/tips/t071201-1.shtml

(in reply to drogers)
Galdelonian

 

Posts: 4
Joined: 1/5/2006
Status: offline

  		RE: CSS Variables - 1/27/2006 20:15:07   
The reason I don't usually do that is because some people like odd colors when I'm designing a page or site for them and they like changing the color of different things. Thus no theme, but still it's how they want it, not to mention I hand script everything and doing it all by hand is actually alot easier without that code. Though CSS ain't long, when you try to script alot of it in a row you sorta miss a ; or two and that's just not exceptable. Though I do like the idea. Knew about it before, but never knew how to do it till just now. :D

(in reply to SerenityNet)
Page:   [1]

All Forums >> Web Development >> Cascading Style Sheets and Accessibility >> CSS Variables 		Page: [1]
Jump to: 1





New Messages No New Messages
Hot Topic w/ New Messages Hot Topic w/o New Messages
Locked w/ New Messages Locked w/o New Messages
 Post New Thread
 Reply to Message
 Post New Poll
 Submit Vote
 Delete My Own Post
 Delete My Own Thread
 Rate Posts


Copyright © 2009 Thomas Brunt's OutFront Inc. All Rights Reserved.