Удалить двойные маркеры во вложенном списке
вложенный список имеет двойные пули. Для li
и еще один для списка детей.
<ul>
<li>item</li>
<li>item</li>
<li>
<ul>
<li>item</li>
<li>item</li>
<li>item</li>
</ul>
</li>
</ul>
4 ответов
вы не можете сделать это только во внешней таблице стилей (как я предполагаю, что вы хотите). Причина в том, что в CSS нет селектора, который бы забрал эти li
элементы, которые имеют ul
элемент в качестве первого ребенка. Таким образом, ваши варианты (кроме ожидания бесконечно, пока CSS не имеет"Родительский селектор"...):
- добавить
class
такойli
elements и используйте селектор классов. Обычно это предпочтительный способ. - использовать JavaScript, который распознает такое
li
элементы и обрабатывает их, например, добавляя к ним класс. - используйте встроенный CSS, т. е.
вложенный список должен быть дочерним элементом одного из элементов списка, например:
<ul>
<li>item</li>
<li>item
<ul>
<li>item</li>
</ul>
</li>
</ul>
это допустимый HTML.
вы не возражаете, если я использую стили? Обновлено
код:
<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";
быстрый взлом: удалить элемент списка:
<ul>
<li>item
<li>item
<ul>
<li>item
<li>item
<li>item
</ul>
</ul>
Если вы не закроете теги, браузер отобразит его правильно, то есть без дополнительной пули. Примечание: это допустимый html, так как вам не нужно закрывать <li>
теги.
источник: Google
" в отличие от XHTML, даже при поставке С типом MIME text / html - позволяет авторам опустить определенные метить."
из google:
если у вас есть список элементов, помеченных как <li>List item</li>, вы можете вместо этого просто написать <li>List item...
опуская необязательные теги сохраняет ваш HTML формально действительным...