Question

我正在使用css Style来做一个下拉菜单。菜单使用UL / LI html标签。我稍后也会在显示文字上使用UL / LI组合。

使用https://www.webydo.com/blog/web-design/freebies/25-winning-navigation-menus-to-download/（数字7）

菜单有效，我得到了我喜欢的下拉菜单。问题是波纹管文档中的要点使用菜单格式。如何覆盖UL / LI格式，以便获得要点。我认为我可以做到

<ul class="x">

其中x是css类的名称，但我不知道css样式是什么。我是否还需要将css类应用于封闭的li标签？

提前致谢。

Answer 1

您可以使用CSS list-style-type

更改它们

举个例子，你可以看到，子弹点是默认的

您也可以将它们更改为项目符号，其中list-style-type: disc;或list-style-type: circle;中间有空格

＆＃13;

.custom {
  list-style-type: square;
}

＆＃13;

<ul>
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
</ul>

<ul class="custom">
  <li>1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
</ul>

＆＃13;

JSFiddle

Answer 2

没有看到完整的代码，只看到了您在链接中提供的示例。要将项目符号点应用于<ul>列表，请将以下 CSS 添加到x类。

x {
    list-style-type: circle;
}

Answer 3

在列表项元素<li>上，您要将list-style-type设置为值initial。

或者，如果您需要，还有其他选项可供选择，例如正方形或空心圆等。但是，如果您想强制使用特定样式，则应该只使用这些选项。 Initial将默认为浏览器/操作系统默认样式。

Answer 4

您可以通过在UL中插入具有不同样式类型的类来覆盖UL样式。例如

CSS

ul.custom{
    list-style-type: square;
    }

HTML

<ul>
   <li>First</li>
   <li>Second</li>
   <li>Third</li>
   <li>Etc</li>
</ul>

如何禁用UL样式？

4 个答案: