Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to use variable in CSS? [duplicate]

Possible Duplicate:
Create a variable in .CSS file for use within that .CSS file

I heard about that we can declare/define variable in CSS and use them like global variables like this:

@nice-blue: #5B83AD;  #header { color: @nice-blue; } 

So anyone knows how to use them?

like image 354
Safran Ali Avatar asked Aug 30 '11 17:08

Safran Ali


People also ask

Can CSS use variables?

The var() function is used to insert the value of a CSS variable. CSS variables have access to the DOM, which means that you can create variables with local or global scope, change the variables with JavaScript, and change the variables based on media queries.

How do you name variables in CSS?

To declare a variable in CSS, come up with a name for the variable, then append two hyphens (–) as the prefix. The element here refers to any valid HTML element that has access to this CSS file. The variable name is bg-color , and two hyphens are appended.

How will you declare a custom property in CSS?

The @property “at-rule” in CSS allows you to declare the type of a custom property, as well its as initial value and whether it inherits or not.


2 Answers

For that you need to use Less or Sass which are CSS Dynamic languages.

here's some comparison between both technologies.

like image 107
balexandre Avatar answered Oct 29 '22 23:10

balexandre


You need to use something like SASS

http://sass-lang.com/#variables

or Less

http://lesscss.org/

like image 26
Jason Gennaro Avatar answered Oct 30 '22 01:10

Jason Gennaro