Неупорядоченные списки

Подобно перечню покупок или сданных в прачечную вещей, неупорядоченный список представляет собой совокупность однородных элементов, между которыми нет отношений порядка или следования. Самые распространенные в сети неупорядоченные списки – это собрание гиперссылок на другие документы. Общая тема, например «Сайты любителей кумкватов», связывает отдельные элементы в неупорядоченный список, который можно читать в каком угодно порядке.

Тег

    Тег
      сигнализирует броузеру, что все, следующее за ним, вплоть до закрывающего тега
    , представляет собой неупорядоченный список элементов. Внутри неупорядоченного списка каждый элемент отмечается тегом
  • . Кроме того, в список может входить практически любое HTML/XHTML-содержимое, включая другие списки, текст и мультимедийные элементы.При отображении броузер обычно предваряет любой элемент списка специальным маркером и, располагая каждый элемент неупорядоченного списка с новой строки, применяет к нему какое-нибудь форматирование, например отступ от левого края окна. Действительное отображение неупорядоченных списков хотя и сходно у популярных броузеров (рис. 7.1), не определяется стандартами, так что не надо увлекаться точным позиционированием элементов на экране.

    Вот пример неупорядоченного списка, описанного в соответствии со стандартом XHTML:
    Popular Kumquat recipes:


    • Pickled Kumquats

    • 'Quats and 'Kraut (a holiday favorite!)
    • 'Quatshakes


    There are so many more to please every palate!

    Ловкие HTML-авторы иногда применяют вложенные неупорядоченные списки с элементами, отмеченными тегом
  • , и без него, чтобы воспользоваться автоматической системой создания последовательных отступов.


    Вы сможете соорудить кое-какие хитроумные фрагменты, применяя этот способ. Но только не полагайтесь на него, имея дело с различными броузерами, особенно с теми, что появятся в будущем.

    Лучше применить свойство border в определениях стиля в тегах абзаца (

    ) или раздела (

    ), чтобы организовать отступы в секциях вашего документа, не являющихся списками.

    Атрибут type
    Графические броузеры автоматически снабжают каждый отмеченный тегом
  • элемент неупорядоченного списка специальным маркером. В частности, Netscape и Firefox выводят ромбик, а Internet Explorer и Opera применяют сплошной закрашенный кружок. Броузеры, поддерживающие HTML 3.2 и более поздние версии, включая 4.0 и 4.1, так же как и XHTML 1.0, позволяют употреблять атрибут type для определения того, какой символ маркера будет отмечать элементы неупорядоченного списка. Этот атрибут может принимать такие значения: disc (диск), circle (круг), square (квадрат).

    Все элементы в списке будут отмечаться указанным маркером, если только отдельный элемент не отменит его спецификацию. Как это делается, описано далее в этой главе.
    С появлением стандарта каскадных таблиц стилей W3C признал нежелательным в HTML 4 и XHTML атрибут type.


    Ожидается, что он выйдет из употребления.

    Компактные неупорядоченные списки
    Если вы любите широкие открытые пространства, вам не понравится необязательный атрибут тега
      compact. Он предлагает броузеру сжать неупорядоченный список в компактный блок меньшего размера. Обычно броузер уменьшает расстояние между представленными элементами. И если он что-нибудь и делает с отступами в списке, так
      убавляет их (обычно броузер ничего с ними не делает).

      Некоторые броузеры игнорируют атрибут compact, поэтому не следует полагаться на его свойства форматирования. Кроме того, этот атрибут признан нежелательным в стандартах HTML 4 и XHTML, так что ему недолго осталось жить.

      Атрибуты class и style
      Атрибуты class и style дают возможность управления отображением списков при помощи каскадных таблиц стилей, что позволяет осуще-ствлять более совершенный контроль, нежели тот, которого можно достичь с применением отдельных атрибутов, подобных type. Включайте атрибут style в тег
        , чтобы назначить в качестве маркеров ваши собственные пиктограммы, вместо того чтобы употреблять общепринятые кружки, диски и квадратики. Атрибут class позволяет применять к содержимому тега стиль, заранее определенный для данного класса списков.


        Значение атрибута class – это имя стиля, определенного в таблице стилей на уровне документа или внешним образом.

        Атрибуты lang и dir
        Атрибут lang позволяет определить язык, который употребляется в списке, а атрибут dir дает возможность посоветовать броузеру, в каком направлении следует выводить текст. Значение атрибута lang – это двухбуквенный код языка по стандарту ISO, включающий необязательный языковой модификатор. К примеру, lang=en-UК сообщает броузеру, что список написан по-английски, причем так, как говорят и пишут в Великобритании (United Kingdom). Предполагается, что броузер как-то отразит в макете и типографских решениях ваш выбор языка.

        Атрибут dir сообщает броузеру, в каком направлении следует отображать содержимое списка: слева направо (dir=ltr), как в английском или русском языках, или справа налево (dir=rtl) для таких языков, как китайский или иврит.

        Атрибуты id и title
        Используйте атрибут id для обеспечения неупорядоченного списка меткой. Допустимое значение атрибута – заключенная в кавычки строка, которая уникальным образом идентифицирует список и позволяет употреблять его в качестве цели гиперссылок и селектора в таблицах стилей, для автоматического поиска и ряда других приложений.

        Вы также можете использовать необязательный атрибут title и заключенную в кавычки строку – значение атрибута – для дополнительной идентификации списка. В отличие от id, значение атрибута title не обязано быть уникальным.

        Атрибуты событий
        Многие относящиеся к поведению пользователя события как внутри списка, так и вне него, такие как одинарный или двойной щелчок мышью в области отображения списка, распознаются современными броузерами. С помощью соответствующих on-атрибутов и их значений можно реагировать на эти события, отображая окно диалога с пользователем или активизируя какое-нибудь мультимедийное событие.

        Оцените статью: (0 голосов)
        0 5 0

        Статьи из раздела HTML на эту тему:
        Вложенные списки
        Директории
        Как использовать списки
        Меню
        Списки определений

Вернуться в раздел: HTML / 7. Форматированные списки