用于HTML中的有序和无序列表及其列表项，以及应用于它们的任何列表样式。
li 标签自动添加项目符号，无需指定列表类型，无需编写 ol/ul 行
你们中的一些人能解释一下为什么当我将 li 标签添加到我的 html 文件时它会立即添加一个项目符号，即使只写了 li 开始和结束标签，仅此而已。 !DOCTYPE html> 你们中的一些人能解释一下为什么当我将 li 标签添加到我的 html 文件时它会立即添加一个项目符号，即使只写了 li 开始和结束标签，仅此而已。 !DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Movies</title> <link rel="shortcut icon" type="image/x-icon" href="X:\Downloads\favicon_play.ico"/> </head> <body> <div> <h2> My personal Top of Anime</h2> <li></li> <h2>My personal top of movies</h2> </div> </body> </html> 谢谢！ 我试图删除曾经在 li 下的元素，我尝试在其他 html 文件中编写，所以我可以看到我的代码的其他部分与此问题有关。 这是设计的默认行为。您可以轻松地根据需要进行修改。 ul, ul li { list-style-type: none; } <ul> <li>My personal Top of Anime</li> <li>My personal top of movies</li> </ul>
我正在使用 CSS 和 vanilla javascript 构建一个可点击的响应式下拉菜单。它的工作效率为 99.99% - 可能足以使用 - 但引擎盖下发生了一些奇怪的事情。我想要 dro...
使用列表本身之外的 div 或 span 更改有序列表项的间距，无需 phpbb 的 css
我想为 phpbb 添加一个 bbcode，它允许有序列表项之间的间距，而不必更改可能在更新时丢失的配置文件。 我试过： 我想为 bbcode 添加一个 phpbb 允许有序列表项之间的间距，而不必更改可能在更新时丢失的配置文件。 我试过： <div class="listspaced" style="margin-bottom: 1.5rem;">{TEXT}</div> 但这不起作用。有没有办法告诉它将边距应用于内联的li项目？ {TEXT}部分是<ol><li></li></ol>项目所在的位置，类是bbcode的名称（这就是phpbb将代码链接到html的方式）。 TIA!!
我想要一个右对齐的列表 德比安 Ubuntu 薄荷 基本操作系统 红帽 ... 我想要一个右对齐的列表 <ol> <li>Debian</li> <li>Ubuntu</li> <li>Mint</li> <li>elementaryOS</li> <li>RedHat</li> <li>Fedora</li> <li>Slackware</li> </ol> 您可以使用 css 并添加 text-align: right; 属性来实现此目的。为了让项目符号跟随，我们需要它们跟随文本并设置在里面。这是用list-style-position: inside;完成的 ol, ul { text-align: right; list-style-position: inside; } <ol> <li>Debian <ul> <li>Ubuntu</li> <li>Mint</li> <li>elementaryOS</li> </ul> </li> <li> RedHat <ul> <li>Fedora</li> </ul> </li> <li>Slackware</li> </ol> 尝试： 李{ 浮动：右 } 在你的 CSS 样式表中
我正在尝试在 Python 中使用带有 Selenium 的 CSS 选择器按下一个“li”元素。网址。问题是：当我在 windows 计算机上运行 python 代码时，它工作，当我在 Linux Ubuntu 上运行相同的代码时
我想要一个包含一些团队名称的下拉列表。他们都直接往下走，但我希望他们每 10 个团队挨着走。我试过弄乱边距，但这不是我们......
所以我很难将项目保持在 LI 元素内联。 每个都由一个 svg 符号、一个复选框和一个文本标签组成。 当标签太长时，文本换行到下一行。 我试过了
第一个代码-这是我为嵌套列表示例所做的代码 1。 第二个代码根据列表的嵌套方式而不同，但给出完全相同的输出。 我们应该使用哪个是
我的网页有一个“瘦”列表：例如，一个包含 100 个项目的列表，每个项目的长度为一个单词。为了减少滚动，我想在页面上以两列甚至四列的形式显示此列表。我该如何...
我目前有代码可以抓取 2 组信息所需的所有信息，并将它们输入到 2 个不同的数据框中。代码是： daily_racecard_info = beautifulSoupText.find(...
我想在每个 li 元素的中心下方创建一个三角形，但不是最后一个。 这是代码笔 https://codepen.io/WiseConnAaron/pen/RwewxwP 这是我想要提供的屏幕截图...
在 Vue v-for 中跳过 null items 和 null children
我在 Vue.js 中有一个嵌套的 for ... in 循环。我想要做的是在元素的值为 null 时跳过元素。下面是 Vue 模板代码： 我在 Vue.js 中有一个嵌套的 for ... in 循环。如果元素的值为null，我想要做的是跳过元素。这是 Vue 模板代码： <ul> <li v-for="item in items" track-by="id"> <ol> <li v-for="child in item.children" track-by="id"></li> </ol> </li> </ul> null元素可能同时存在于item和item.children对象中。 例如： var data = { 1: { id: 1, title: "This should be rendered", children: { 100: { id: 100, subtitle: "I am a child" }, 101: null } }, 2: null, 3: { id: 3, title: "Should should be rendered as well", children: {} } }; 使用此数据 data[1].children[101] 不应呈现，如果 data[1].children[100] 稍后变为空，则应从列表中省略它。 我无法控制这些数据的结构，所以我必须以这种形式处理它。 一个简单的v-if可能会起作用： <li v-for="item in items" v-if="item !== null" track-by="id"> 试一试。如果没有，请这样做： 您可以为此添加一个过滤器（在您的 App 实例之前的main.js）： Vue.filter('removeNullProps', function(object) { return _.reject(object, (value) => value === null) }) 然后在模板中： <li v-for="item in items | removeNullProps" track-by="id"> <ol> <li v-for="child in item.children | removeNullProps" track-by="id"></li> </ol> </li> 在 Vue 2 中，过滤器已在 v-fors 中弃用。 现在你应该使用计算属性。下面的演示。 new Vue({ el: '#app', data: { items: [ 'item 1', 'item 2', null, 'item 4', null, 'item 6' ] }, computed: { nonNullItems: function() { return this.items.filter(function(item) { return item !== null; }); } } }) <script src="https://unpkg.com/vue@2"></script> <div id="app"> Using a computed property: <ul> <li v-for="item in nonNullItems"> {{ item }} </li> </ul> <hr> Using v-if: <ul> <li v-for="item in items" v-if="item !== null"> {{ item }} </li> </ul> </div> 我建议你不要在同一个元素中使用 v-if 和 v-for。我发现有效但不影响性能的是： <li v-for="(value, key) in row.item.filter(x => x !== null)" :key="key"{{value}}</li> 你只需要在你正在经历的数组上运行过滤函数。这是 c# 中的常见用法，发现它在 JavaScript 中也没有什么不同。这基本上会在迭代时跳过空值。 希望这会有所帮助（3 年后）。 只需使用v-if来处理它。但首先，不要使用 track-by="id" 因为 null 项目和 null 孩子。您可以在此处查看演示 https://jsfiddle.net/13mtm5zo/1/。 也许更好的方法是在渲染之前先处理数据。 Vue.Js 风格指南告诉我们： “永远不要在与 v-for 相同的元素上使用 v-if。” 如何根据 Vue 风格指南正确处理 v-if 和 v-for： <ul v-if="shouldShowUsers"> <li v-for="user in users" :key="user.id" > {{ user.name }} </li> </ul> 在此处查看有关如何使用 v-if 处理 v-for 的更多信息：https://v2.vuejs.org/v2/style-guide/#Avoid-v-if-with-v-for-essential
首先我会把你放在上下文中 我们有一个有序列表（TAD JuryList）来存储不同的陪审团： typedef 结构 tItemJ{ tJuryName 陪审团名称； tNumVotes 总选民数； tNumVotes 有效投票...
我正在尝试使用新的 Jekyll 主题更新我的个人网站，并且我有一些嵌套列表想保留在我的内容中。主题中的 CSS 设置了 ... 的 padding-left 值 我正在尝试使用新的 Jekyll 主题更新我的个人网站，并且我有一些嵌套列表想保留在我的内容中。主题中的 CSS 将 padding-left 的 <ul> 值设置为 0，最终打破了我列表的嵌套。如何在不破坏嵌套的情况下将列表向左填充 0？我想让整个网站的列表样式保持一致。 降价来源： + item + nested item + item 2 + nested item 2 HTML 输出： <ul> <li>item <ul> <li>nested item</li> </ul> </li> <li>item 2 <ul> <li>nested item 2</li> </ul> </li> </ul> 实际产量： 项目 嵌套项目 项目 2 嵌套项目 2 预期输出： 项目 嵌套项目 项目 2 嵌套项目 2
我的 UL 结束后出现了额外的项目符号。 文字 文字 文字 文字 文字 ... 我的 UL 结束后出现了额外的项目符号。 <ul> <li>Text</li> <li>Text</li> <li>Text</li> <li>Text</li> <li>Text <ul> <li>Text</li> <li>Text</li> </ul> </li> </ul> 我尝试了几种解决方案都没有解决问题。 经检查，此代码在我的实例中按预期工作。 请检查您的电子邮件内容中是否链接了其他代码。 <ul> <li>Text</li> <li>Text</li> <li>Text</li> <li>Text</li> <li>Text <ul> <li>Text</li> <li>Text</li> </ul> </li> </ul> 5 “文本”值如“粗体圆点” 2 “空圆项目符号”中的“文本”值
标记空间截图 正如您在屏幕上看到的那样，列表项之间有一些垂直空间，我知道如何删除所说的东西，我以前做过但似乎找不到方法
How to add link to list items in HTML?
Linus Torvalds 上的维基百科页面 Linus Torvald 的个人网站 Linux 内核档案 我想添加指向列表项的链接（例如，我必须添加指向维基百科页面的链接...
我想在 中添加一个按钮（deleteButton），之前创建并附加到 我的代码： 让 eventList = []; const inputBox = document.querySelector('.input-... 我想在 <li></li> 中添加一个按钮（deleteButton），之前创建并附加到 <ol> 我的代码： let eventList = []; const inputBox = document.querySelector('.input-field'); const submit = document.querySelector('.submit'); const itemsList = document.querySelector('.list') function addEvent() { const showEvent = inputBox.value; const li = document.createElement('li'); const deleteButton = document.createElement('button'); itemsList.appendChild(li); li.appendChild(deleteButton); eventList.push(showEvent) li.textContent = showEvent; inputBox.value = ''; } submit.addEventListener('click', addEvent); <h1>TO-DO LIST</h1> <input class="input-field" type="text"> <button class="submit" type="button">ADD TO-DO</button> <ol class="list"></ol> 按钮根本没有显示。我该怎么做才能让它显示在 li 元素中？ let eventList = []; const inputBox = document.querySelector('.input-field'); const submit = document.querySelector('.submit'); const itemsList = document.querySelector('.list'); function addEvent() { const showEvent = inputBox.value; const li = document.createElement('li'); const deleteButton = document.createElement('button'); deleteButton.textContent = "Delete"; li.appendChild(deleteButton); itemsList.appendChild(li); eventList.push(showEvent); li.textContent = showEvent; inputBox.value = ''; deleteButton.addEventListener('click', () => { itemsList.removeChild(li); eventList.splice(eventList.indexOf(showEvent), 1); }); } submit.addEventListener('click', addEvent); 更新后的代码，我们创建一个删除按钮元素，将其文本内容设置为“Delete”，并将其附加为<li> 元素的子元素。我们还为删除按钮添加了一个事件监听器，它从列表中删除<li> 元素，并从 eventList 数组中删除相应的事件。
我有一个只包含图像的 LI，设置为大约 100 像素高。我在此列表中有字母标记，但它们位于图像的底部，靠近左下角；我可以定位...
这里的新手在尝试复制这种有序列表样式时会遇到很多麻烦。 我已经尝试使用某些样式技术并获得了一些方法但无法添加内联 l ...