И правильное размещение маркеров и текста пунктов списка
3. Добавьте в стиль #announcement 1 i еще два свойства:
padding-left: 25рх:
margin-bottom: lOpx:
Обучающий урок 3: исnользование фоновых изображений 237
Левый отступ добавляет пустой промежуток, смещая текст в сторону, чтобы
Отобразить новый значок маркера. Нижнее поле обеспечивает рассредоточение
Элементов списка, образуянебольшие интервалы (см. рис. 8.16, посередине).
Однако остался еще один недостаток. Изображение маркера чуть выступает над
Текстом строки, и значок выделяется над текстом пунктов списка. Это легко
Исправить с помощью свойства backgrouпd-positi оп.
Завершим этот стиль, добавив свойство background-position: Орх 4рх:. Законченный
стиль должен выглядеть следующим образом:
#aпnouncement li {
list-style: поnе:
backgrouпd- image: url ( images/bull et .. png):
backgrouпd-repeat: пo-repeat:
background·position: О 4рх:
paddiпg-left: 25рх:
margin-bottom: lOpx:
Это последнее изменение стиля позиционирует значок маркера в крайнюю левую
Позицию (это 0), отстоящую на 4 пиксела от верхнего края элемента-пункта
Списка, что обеспечивает совсем незначительное смещение значка, тем не
Менеедостаточное для того, чтобы маркер выглядел безупречно.
сов~----------------------------------------------------
Я рекомендую использовать именно свойство Ьackground вместо list-style-image для добавления