Ottimizzare codice css

[Fede 88]

Ho 9 div, per ogni div è stata creata una classe che gli da: colore di sfondo, float, altezza e margine.

La questione è che l'unico valore che varia per ogni div è il colore di sfondo, c'è modo di assegnare le altre caratteristiche a tutte le div senza doverle necessariamente riscrivere in ogni classe?


.bar-1 {
background-color: red;
float: left;
height: 37px;
margin-right: 5px;
}

.bar-2 {
background-color: yellow;
float: left;
height: 37px;
margin-right: 5px;
}

.bar-3 {
background-color: green;
float: left;
height: 37px;
margin-right: 5px;
}

.bar-4 {
background-color: blue;
float: left;
height: 37px;
margin-right: 5px;
}

.bar-5 {
background-color: white;
float: left;
height: 37px;
margin-right: 5px;
}

.bar-6 {
background-color: orange;
float: left;
height: 37px;
margin-right: 5px;
}

.bar-7 {
background-color: yellow;
float: left;
height: 37px;
margin-right: 5px;
}

.bar-8 {
background-color: blue;
float: left;
height: 37px;
margin-right: 5px;
}

.bar-9 {
background-color: green;
float: left;
height: 37px;
}


Grazie a tutti per l'aiuto!

[Ludo237]

potresti fare una cosa un po spartana

allora hai il tuo div

<div class="bar">
</div>

a questo punto nel css inserisci solo una classe


.bar-1 {float: left;height: 37px;margin-right: 5px;}


poi per ogni div fai questa modifica
<div class="bar" style="backgroud-color: red>
</div>

un altro consiglio invece di usare red come impostazione cerca sempre di usare gli esadecimali red = #FF0 o CC0

[wingman87]

Se hai solo quei div basta aggiungere una regola per tutti i div:
div {
float: left;
height: 37px;
margin-right: 5px;
}
Altrimenti puoi usare una classe unica e poi distinguerli per id:
div.bar {
float: left;
height: 37px;
margin-right: 5px;
}
div#bar_1{
background-color: red;
}
div#bar_2{
background-color: yellow;
}
...

[Fede 88]

Grazie per l'aiuto, ho fatto alcune prove però ho un problema con questo codice: background-image: url(images/abbigliamento.png);

Nel CSS funziona, però se lo sposto mettendolo all'interno della div utilizzando il tag style non funziona più, non capisco perché, mi sai aiutare?

[Kenger]

Non sò molto di CSS ma magari la funzione url() funziona solo all'interno di un foglio di stile. Prova a mettere direttamente il percorso completo dentro allo style.