Удалить двойные маркеры во вложенном списке

вложенный список имеет двойные пули. Для li и еще один для списка детей.

пример

    <ul>
        <li>item</li>
        <li>item</li>
        <li>
            <ul>
                <li>item</li>
                <li>item</li>
                <li>item</li>
            </ul>
        </li>
    </ul>

8
css html html-lists

4 ответов

вы не можете сделать это только во внешней таблице стилей (как я предполагаю, что вы хотите). Причина в том, что в CSS нет селектора, который бы забрал эти li элементы, которые имеют ul элемент в качестве первого ребенка. Таким образом, ваши варианты (кроме ожидания бесконечно, пока CSS не имеет"Родительский селектор"...):

  • добавить class такой li elements и используйте селектор классов. Обычно это предпочтительный способ.
  • использовать JavaScript, который распознает такое li элементы и обрабатывает их, например, добавляя к ним класс.
  • используйте встроенный CSS, т. е.
5

вложенный список должен быть дочерним элементом одного из элементов списка, например:

<ul>
  <li>item</li>
  <li>item
    <ul>
      <li>item</li>
    </ul>
  </li>
</ul>

это допустимый HTML.

6

вы не возражаете, если я использую стили? Обновлено

код:

        <ul>
            <li>item</li>
            <li>item</li>
            <li style="list-style:none">
                <ul>
                    <li>item</li>
                    <li>item</li>
                    <li>item</li>
                </ul>
            </li>
        </ul>
        <ol>
            <li>item</li>
            <li>item</li>
            <li style="list-style:none"><ol>
                    <li>item</li>
                    <li>item</li>
                    <li>item</li>
                </ol>
            </li>
        </ol>

другой метод может выполняться через список LI и добавлять стиль путем обнаружения дочерних узлов. пример

код (HTML то же самое):

var li = document.getElementsByTagName("li");

for (var i=0, max=li.length; i < max; i++)
    if (li[i].childNodes.length > 1)
        li[i].style.listStyle = "none";
4

быстрый взлом: удалить элемент списка:

<ul>
    <li>item
    <li>item
    <ul>
         <li>item
         <li>item
         <li>item
    </ul>
</ul>

Если вы не закроете теги, браузер отобразит его правильно, то есть без дополнительной пули. Примечание: это допустимый html, так как вам не нужно закрывать <li> теги.

JSFIDDLE с обоими примерами

источник: Google

" в отличие от XHTML, даже при поставке С типом MIME text / html - позволяет авторам опустить определенные метить."

из google:

если у вас есть список элементов, помеченных как &ltli>List item&lt/li>, вы можете вместо этого просто написать &ltli>List item...

опуская необязательные теги сохраняет ваш HTML формально действительным...
-2