CMS Joomla! для начинающих - UL. Установка отступов маркированного списка. Часть 1

Партнеры

Опрос (НОВЫЙ!)

Интересна ли Вам тема интернет-магазина для Джумлы?

	Не интересна
	Да, собираюсь создавать магазин
	Да, есть сайт с магазином (на Joomla 1.0.x)
	Да, есть сайт с магазином (на Joomla 1.5.x)

Авторизация

Последние 3 записи в Гостевой

Елена Васильева

Перед покупкой прилегающей одежды важно знать вашу форму тела. Некоторые женщины имеют неправильное представление о том, что ношение прилегающей одежд

Продолжить

Slimera Garcinia Cam

. You can select any trustworthy hospital when you purchase slimming tablets online.So searching for a sliming treatment? Wish to loose weight as earl

Продолжить

Фактор 4

Этот тип упражнений делается на коленях или лежа на животе. Это упражнение также устраняет напряжение в спине и шее, которое можно получить, делая скр

Продолжить

Кто на сайте?

Статистика

Пользователей: 4939
Ссылок: 57

Спонсоры

UL. Установка отступов маркированного списка. Часть 1

Автор Иван Мензуркин (старший лаборант)

21.01.2008 г.

Примеры для случая, когда маркеры списка расположены вне поля списка. Расположение маркеров определяется стилем list-style-position, в примерах он не задан, а по умолчанию принимает значение outside.

Пример ul1-1. Вид списка по умолчанию (никакие стили не заданы, кроме цвета фона).
IЕ 6.x: устанавливает дополнительный отступ списка слева, до него и после.
FF 2.x: То же самое. Обратите внимание, что FF стиль list-style-position отображает как и надо (т.е. outside), но вот фон списка захватывает маркеры в отличие от IE!

Текст перед списком

Элемент списка 1
Элемент списка 2 для демонстрации того, когда маркер списка обтекается текстом, а когда нет
Элемент списка 3
Элемент списка 4

Текст после списка

Пример ul1-2. Указан явно один стиль "margin: 0".
IЕ 6.x: обратите внимание, что маркеры списка куда-то пропали! Они просто ушли за левую границу контейнера (ячейки таблицы) и ИЕ их не показывает. Посмотрите страницу в Мозилле и почувствуйте разницу!
FF 2.x: отступов сверху и снизу теперь нет, а вот отступ слева остался

Текст перед списком

Элемент списка 1
Элемент списка 2 для демонстрации того, когда маркер списка обтекается текстом, а когда нет
Элемент списка 3
Элемент списка 4

Текст после списка

Пример ul1-3. Экспериментируем с ИЕ. Установим "margin: 14px" и увидим, что маркеры стали на половину видны!

Текст перед списком

Элемент списка 1
Элемент списка 2 для демонстрации того, когда маркер списка обтекается текстом, а когда нет
Элемент списка 3
Элемент списка 4

Текст после списка

Пример ul1-4. Изменяем настройки отступов списка, задаваемые браузерами по умолчанию, чтобы список выглядел однообразно: "margin: 0 0 0 20px"
FF 2.x: отступ списка слева все равно большой и отличается от ИЕ? Для полной идентичности надо явно указать стиль padding, что и сделано в примере 5 (следующий)

Текст перед списком

Элемент списка 1
Элемент списка 2 для демонстрации того, когда маркер списка обтекается текстом, а когда нет
Элемент списка 3
Элемент списка 4

Текст после списка

Пример ul1-5. Отступы списка выглядят однообразно!
(применили стиль "margin: 0 0 0 20px; padding: 0")
FF 2.x: Чудо - маркеры теперь тоже вне поля списка. Похоже - это результат применения стиля "padding: 0"

Текст перед списком

Элемент списка 1
Элемент списка 2 для демонстрации того, когда маркер списка обтекается текстом, а когда нет
Элемент списка 3
Элемент списка 4

Текст после списка

Коментарии (10)


	Поведение огненной лисы в условиях проводимого эксперимента к настоящему моменту изучено не полностью. Как только получим результаты, дополним результирующую таблицу ... А вот и она побежал ловить!

Иван Мензуркин, 19:55 21 января 2008 г.


	С FireFox разобрались, результаты - в таблице (обратите внимание на первый и последний примеры)

Иван Мензуркин, 11:24 28 января 2008 г.


	Как установить вместо стандартных круглешков Галочку???? например здесь http://www.shoptravelspb.ru/index.php/the-countries/41

Леонтий, 12:09 23 июня 2011 г.


	Полезная информация, советую всем![ юмор, позитив, красивые фото, приколы и много интересного контента

Tryxy, 14:36 13 июня 2012 г.


	All of these articles have saved me a lot of heahdcaes.

Natalia, 08:47 31 июля 2013 г.


	This shows real exrsetipe. Thanks for the answer. http://pudhxutoc.com [url=http://hhpicl.com]hhpicl[/url] [link=http://gafhqdeezdx.com]gafhqdeezdx[/link]

Jackie, 23:48 10 августа 2013 г.


	Есть небольшая проблема. У меня на сайте само меню и разделители получаются маркированными. Я со стилями не очень разбираюсь как убрать эти маркеры?

Леха, 09:45 03 октября 2013 г.


	В файле CSS стилей шаблона укажи параметр "list-style: none;" для класса этих списков.

Админ, 13:46 04 октября 2013 г.


	спасибо, получилось!!!

Леха, 17:47 04 октября 2013 г.


	Мне нужно задать разметку тексту при помощи CSS, чтобы этот текст выглядел как список с маркерами. Один нюанс! Этот текст генерирует JavaScript как массив, то есть массив преобразуется в список. За такую разметку отвечает display:list-item? Я правильно понимаю или как?

Димка, 13:42 08 ноября 2013 г.

Добавить коментарий

Имя:
Коментарий:
Код:*

Последнее обновление ( 28.01.2008 г. )

Вернуться