Есть ли способ сгруппировать элементы `<li>`?

Question

Мне нужно разделить на группы несколько <li> элементов в списке, это возможно? (Я знаю, что я даю каждому элементу разные имена классов / разделяю их на разные <ul>)

Answer 1

Рассматривали ли вы вложенные UL? Я считаю, что это подтвердит:

<UL>
    <LI>
        <UL>
            <LI></LI>
            <LI></LI>
            <LI></LI>
        </UL>
    </LI>
    <LI>
        <UL>
            <LI></LI>
            <LI></LI>
            <LI></LI>
            <LI></LI>
            <LI></LI>
        </UL>
    </LI>
</UL>

Ваш трюк с CSS был моим первым предположением; Жаль, что ты не можешь использовать это.

Answer 2

Рассматривали ли вы использование множественного наследования классов CSS? Это может быть немного грязно для поддержки, но это решит случай одной и той же записи в нескольких группах. HTML выглядит примерно так:

<ul class="pizza-toppings">
    <li class="meat">pepperoni</li>
    <li class="meat">bacon</li>
    <li class="vegetarian">cheese</li>
    <li class="vegetarian vegan">mushrooms</li>
    <li class="vegetarian vegan">onions</li>
</ul>

Здесь у нас есть три группы (мясная, вегетарианская и веганская), и некоторые начинки, такие как грибы и лук, являются частью более чем одной группы.

Answer 3

В соответствии со схемой XHTML (или одной схемой в любом случае), единственное, что вы помещаете внутрь <ul>, это <li>, как описано в http://www.w3.org/TR/2006/WD-xhtml-modularization-20060705/abstract_modules.html#s_listmodule

Вы можете настроить внешний вид элементов списка с помощью CSS, назначив различные значения класса элементам <li>.

<li class="group1"> ...
<li class="group1"> ...
<li class="group1"> ...
<li class="group2"> ...
<li class="group2"> ...
<li class="group2"> ...

Answer 4

Если вам нужно разделить на разные группы элементы из одного неупорядоченного списка, тогда они должны принадлежать к разным спискам, не так ли ИЛИ должны быть сгруппированы в упорядоченный список (много UL в одном OL).

Если это для нужд презентации (для отображения одного списка во многих столбцах) и вы можете решить несколько ограничений, второй метод в https://web.archive.org/web/1/http://articles.techrepublic%2ecom%2ecom/5100-10878_11-5810687.html или объяснен также здесь: http://www.communitymx.com/content/article.cfm?page=2&cid=27F87

Такие группы существуют для select (optgroup), но, очевидно, вы не можете разделить элементы option, потому что вы должны выбрать только один из них, чтобы они принадлежали одному и тому же элементу.

Answer 5

Я считаю, что ваши единственные варианты - это те, которые вы уже определили, множественные списки или с помощью классов, поскольку для li в списке, заданном ul или ol, это должен быть непосредственный дочерний элемент этого ul / ol ( ссылка ).