Parâmetros pré-definidos no CSS

Front-end

01/10/2012

Oi, gente. Olha eu aqui de novo...
Existe uma forma de parametrizar atributos CSS? Deixa eu tentar exemplificar pra ficar mais claro. A ideia era algo mais ou menos assim:
COR_PADRAO = #fff

.classe1{
background:COR_PADRAO
}

#elementoA{
color:COR_PADRAO
}


Assim, quando eu precisasse mudar um valor que é largamente utilizado, só faria uma alteração.
Será que é possível? Como?
Obrigada desde já.
Rachel Andrade

Rachel Andrade

Curtidas 0

Respostas

Washington Morais

Washington Morais

01/10/2012

Com o CSS nativo voce não vai conseguir, até porque o CSS é para definição de apresentação e não uma linguagem de programação com loops, condições, etc.

Mas nem tudo está perdido. Existem algumas extensões que permitem esta técnica. Um deles é o LessCS ([url]http://lesscss.org/[/url])

Exemplo de uso:

 <!-- Arquivo CSS. Veja um conteudo de exmplo logo abaixo -->
 <link rel="stylesheet/less" type="text/css" href="styles.less">

 <!-- Plugin do LessCSS -->
 <script src="less.js" type="text/javascript"></script>


Exemplo de conteudo do arquivo "styles.less"
@base: #f938ab;

.box-shadow(@style, @c) when (iscolor(@c)) {
  box-shadow:         @style @c;
  -webkit-box-shadow: @style @c;
  -moz-box-shadow:    @style @c;
}
.box-shadow(@style, @alpha: 50%) when (isnumber(@alpha)) {
  .box-shadow(@style, rgba(0, 0, 0, @alpha));
}
.box { 
  color: saturate(@base, 5%);
  border-color: lighten(@base, 30%);
  div { .box-shadow(0 0 5px, 30%) }
}


No site voce consegue bastante informação sobre o plugin.

Abraços

___________________
Washington Morais
MCP / MCTS
GOSTEI 0
Rachel Andrade

Rachel Andrade

01/10/2012

Nossa, Washington, parece que esse LESS CSS é exatamente o que eu preciso. Parece ser bom.
Vou dar uma olhada e posto os resultados em breve.
Muitíssimo obrigada;
GOSTEI 0
Washington Morais

Washington Morais

01/10/2012

Disponha Raquel. Qualquer dúvida posta ae que tentaremos ajudar.


Abraços

___________________
Washington Morais
MCP / MCTS
GOSTEI 0
Rachel Andrade

Rachel Andrade

01/10/2012

Washinton,
voltei para te agradecer novamente. Consegui utilizar o LESS CSS e realmente me pareceu muito interessante. Consegui fazer o que eu queria e isso vai me poupar um trabalhão, posto que algumas "variáveis" estão sendo constantemente alteradas, uma vez que o projeto se encontra em fase de desenvolvimento e teste.
Obrigada.
GOSTEI 0
POSTAR