Есть два способа.
(Лично мне импонирует второй)
1. Дать блокам два класса. Одному классу дать параметры, которые будут идентичны у всех, второму - персональные.
Например:
#html
div class="block personal1">
div class="block personal2">
div class="block personal3">
#style
.block{
color: red;
width: 210px;
height: 60px;
}
.personal1{
background-image: url();
}
.personal2{
background-image: url();
}
.personal3{
background-image: url();
}
2. Второй способ подразумевает использование шаблона.
Создаешь шаблон, прописываешь параметры, и присваиваешь его блокам.
Например:
#html
div class="block1">
div class="block2">
div class="block3">
#style
%example{
color: red;
width: 210px;
height: 60px;
}
.block1{
@extend %example;
background-image: url();
}
.block2{
@extend %example;
background-image: url();
}
.block3{
@extend %example;
background-image: url();
}
Итог: В первом варианте ты создаешь два класса, один класс наследуют все три блока, остальные три разных класса каждый индивидуально. Во втором варианте ты создаешь шаблон один раз, и используешь его для всех блоков, а отличающийся параметр пишешь отдельно.
Второй вариант экономит и сужает текст кода (при написании больших кодов), а также удобен в использовании повторяющихся значений, и в отличии от первого варианта не нуждается в "размножении классов". Какой удобен будет тебе - решай сам.
