Как. Каждому виджету в заголовке вначале задать иконку? Лучше, чтоб в код не лезть. Иначе захочеться виджеты поменять местами или убрать — и слетит весь дизаин разом.
Ответить
Grawl
У них есть ID и классы — что ещё надо? И далее:
#IDвиджета.классвиджета h3 {
padding-left: ширина иконки;
height: высота иконки;
background: url('путь до иконки') center no-repeat;
}
Ответить
FHD
Работает, если без названия виджета. Но мне нужно, чтоб иконка слева была, потом текст. Сделал : … left no-repeat; — Иконка сместилась влево. Но теперь — текст вверху и прилипает к иконке. (начинается от верхнего правого угла иконки). Надо как-то его опустить вниз и сделать небольшой отступ от иконки.
Ответить
Alex.deq
про отступы.. в CSS они задаются следующими атрибутами: 1) margin — oпределяет ширину поля за пределами границы элемента: margin: margin-top | margin-right | margin-bottom | margin-left
1.1) margin: 25px 30px 40px 80px → указаны ширины внешних полей (по часовой стрелке: верхнее, правое, нижнее, левое);
1.2)margin: 0 auto → позволяет расположить блок по центру.
1.3)margin-top — верхнее внешнее поле элемента:
margin-top: 20px → величина может быть указана в пикселях или в процентах.
1.4) margin-right — определяет ширину правого внешнего поля:
margin-right: 40px
1.5) margin-bottom | margin-left — определяют соответственно нижнее и левое внешнее поле.
2) padding— определяет ширину полей между границей элемента и его содержимым:
Я бы сделал на CSS.
Как.
Каждому виджету в заголовке вначале задать иконку?
Лучше, чтоб в код не лезть. Иначе захочеться виджеты поменять местами или убрать — и слетит весь дизаин разом.
У них есть ID и классы — что ещё надо?
И далее:
Работает, если без названия виджета. Но мне нужно, чтоб иконка слева была, потом текст.
Сделал : … left no-repeat; — Иконка сместилась влево.
Но теперь — текст вверху и прилипает к иконке. (начинается от верхнего правого угла иконки). Надо как-то его опустить вниз и сделать небольшой отступ от иконки.
про отступы..
в CSS они задаются следующими атрибутами:
1) margin — oпределяет ширину поля за пределами границы элемента:
margin: margin-top | margin-right | margin-bottom | margin-left
1.1) margin: 25px 30px 40px 80px → указаны ширины внешних полей (по часовой стрелке: верхнее, правое, нижнее, левое);
1.2)margin: 0 auto → позволяет расположить блок по центру.
1.3)margin-top — верхнее внешнее поле элемента:
margin-top: 20px → величина может быть указана в пикселях или в процентах.
1.4) margin-right — определяет ширину правого внешнего поля:
margin-right: 40px
1.5) margin-bottom | margin-left — определяют соответственно нижнее и левое внешнее поле.
2) padding— определяет ширину полей между границей элемента и его содержимым:
padding: padding-top | padding-right | padding-bottom | padding-left
2.1) padding: 20px
2.2) padding-top — определяет верхнее внутреннее поле элемента:
pading-top: 30px
2.3) padding-right | padding-bottom | padding-left — соответственно правое, нижнее и левое внутреннее поле.