css – 如何使用离子框架显示项目符号列表?

前端之家收集整理的这篇文章主要介绍了css – 如何使用离子框架显示项目符号列表?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
使用ionic来构建应用程序,我需要显示一个实际的项目符号列表:

>第1项
>第2项
>第3项

但是,似乎框架在< ul>上执行某种CSS重置/魔术.和< li>这些元素应该只用作结构元素(例如列表),而不是用作UI.

我最终创建了自己的无序列表CSS样式,以便为我提供所需的UI.这是自己动手做的正确方法 – 还是离子有一些深藏在我内心深处的CSS风格吗?

ty提前.

解决方法

只是覆盖重置.
ol,ul {
  list-style: none;
}

像这样(在框架的CSS之后放在你的CSS中)

ul {
  list-style-type: disc;
}

最佳实践:在导航元素上设置一个类,即ul.

<section>    
  <ul class="my-nav">
    <li>List item</li>
    <li>List item</li>
  </ul>
</section>

.my-nav {
  list-style-type: disc;
}

猜你在找的CSS相关文章