Я кодирую .psd
изображение до html
. Но я смутился с лучшей практикой.
т.е. для укладки в achor
как кнопка я использую следующий стиль атрибутыЛучшие практики для HTML/CSS
.button {
padding: 10px;
display: inline-block;
text-decoration: none;
background-color: #3f4551;
color: white;
background-image: url("../images/icons/icon_left.png") no-repeat 10px center;
}
теперь я могу использовать <a href="#" class="button"></a>
, чтобы получить желаемый результат.
Однако у меня есть много якоря, которые имеют такое же стиль, как и раньше только с незначительными изменениями, как значка на правой стороне, а не оставил и различного цвета, градиент и т.д.. поэтому я решил разбить его в нескольких class
т.е.
.button{
padding: 10px;
display: inline-block;
text-decoration: none;
background-repeat: no-repeat;
}
.icon_left{
background-position: 10px center;
}
.color_blue{
color:blue;
}
теперь я могу использовать эти классы для стилизации т.е. <a href="#" class="button icon_left color_blue></a>"
Но в этом случае разметка становится все более и более неуклюжим и weird.So я решил спросить, для которых это лучшая практика ??? СПАСИБО в Advance :)
Лучшей практикой для кнопки является использование кнопки, а не ссылки. –
@Truth: Почему вы так говорите? Они * являются * ссылками. Это точка CSS, решения UI - это еще одна тема. –
Что вы подразумеваете под «.psd image to html» и как, если это вообще так, относится к вашему вопросу? –