Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Eae!
Bom, eu ainda sou bem iniciante em CSS, daí to com uma dúvida retardada simples pra não fu*** com meu código, tipo, tenho uma classe assim:
.input{
width:75%;
margin:3px 0 15px 10px;
font-size:12px;
border:1px #666 dotted;
background-color:#F5F5F5;
}Daí, por exemplo tem uma página que não quero usar o width 75%, e sim 50%... daí é usual fazer isso?
<inpu type="text" name="nome" id="nome" class="input" style="width:50%;" />
Ou é coisa de retardado? rs..
Eu to perguntando pra saber a metodologia e não deixar o código feio... e com lixo..!
A pergunta é simples mas acho que até pode ser a dúvida de algumas outras pessoas... :)
valeu abs
É, a ideia de criar uma outra classe só para definir o width seria legal, mas ele varia pra cada página do meu sistema praticamente, então imagina eu ter width50, width55, complicado né..
mas mesmo assim talvez seja o ideal..
:D
Bom, então nesse caso acredito que você deva restruturar o seu layout.
A julgar que esse style vai ser aplicado à um elemento de formulário (campo de texto):
Um layout cuja porção "utilizável" (corpo da página) for de 80%.
Nele, você tenha um formulário que ocupe 95% (dos 80%, para considerar algum padding).
Esse formulário, sendo semântico, poderia ser construído com fieldsets, legends e ol's (ou ul's).
Cada elemento do formulário, em um **<li>** seria composto basicamente por um **<label>** e um elemento.
Bastaria, então, definir duas classes para os **<label>**: uma de largura estreita (5% dos 95% disponíveis) e outra mais larga (20% dos 95% disponíveis).pessoalmente, eu não vejo 'problemas' nesse tipo de uso do css inline.
só acho 'sem sentido', criar uma class, para atingir algo que poderia ser atingido com a tag
em vez de:
.input {}poderia muito bem usar logo:
input {}
e se tiver algum type="submit", ai é excessão, e não regra.
<input type="submit" name="ok" value="ok" class="submit" />
..Entendi,
mas por exemplo, eu usando
input {
}
como eu faria para "zerar" os atributos do outro campo que eu teria que utilizar class?
pq se eu usar
<input type="text" name="nome" id="nome" class="outro_input" />
pq mesmo que eu utilize esse outro class, ele recebe os atributos do input geral...
a declaração da class é 'mais forte' que a aplicada diretamente na tag.
se você fizer:
<input type="text" name="tal" class="largo" />
e no css:
.largo { width: 500px; }
input { width: 100px; }
com qual largura você acha que o input vai ficar?
500px da class?
ou 100px da tag ?
pense..
:P
resposta: 500px, pois a especificidade da class é maior que a 'da tag'
agora.. 'qual a dúvida'?
usar a cascata do css, é o grande segredo.
e se tiver algo que realmente precise zerar, sem sobrescrever (como fiz no exemplo acima), basta usar os valores 'nulos'(sobrescrevendo):
.largo { background: none; margin: 0; ... }enfim.. mas para isso, veja bem oque você for fazer na tag, e oque você vai fazer na class
por isso que eu pessoalmente, não vejo o menor problema de se usar estilos inline.
desde que se saiba muito bem oque está fazendo, e tenha controle sobre o teu código.
São uma 'mão na roda', depois que você realmente compreende especificidade e a cascata
Realmente, agora sim entendi...
valeu pelas respostas!
ajudou bastante, afinal quero deixar meu código o mais otimizado possível http://forum.imasters.com.br/public/style_emoticons/default/clap.gif
Ser coisa de retardado eu acredito que não seja afinal, se fosse, o uso de estilos inline não seria possível.
Mas que fica feio, fica. Você pode experimentar separar a propriedade que vai variar mais (no caso width) em outra classe e, na hora de usar um class, adiciona ela junto separando por espaço:
<input type="text" name="nome" id="nome" class="input width75" />E você define:
.width75 { width: 75%; }Outra possibilidade, inviável do ponto de vista performance, seria duplicar as outras propriedades, numa classe própria e usar onde precisar.