在html中,可以使用ol/ul/dl显示各种列表信息。其中ol是有序列表,也就是每个列表项前标有数字,表示顺序;ul是无序列表,默认情况每个列表项前有黑圆点;而dl则是定义列表,主要用于术语解释。三种列表的具体用法,网络上已经有很多的教程,这里不打算详细说明。
一般情况下,无序列表ul的使用比较多,有个时候,不想在列表项前显示那个黑点,或者想显示成其他的标志,如空心圆点、空心方块等,这可以通过设置ul的属性type来设定。
<li>列表项1</li>
<li>列表项2</li>
</ul>
其中:
- type=disc 黑圆点,默认风格
- type=circle 空心圆点
- type=square 空心方块
- type=none 不显示任何标志
但有个时候,整个ul列表的代码是通过javascript代码从其他网站得到的,这样就无法修改ul的type属性。例如,本站首页的NinGoo’s shared items的内容就是通过javascript脚本从Google Reader中获得的,由于本站侧边栏采用右对齐,列表项目前面默认的黑圆点无法对齐,相当难看,且和其他部分风格不协调。这时只能通过css来将列表项的type设置成none:
list-style-type: none;
}
现在再去看看本站首页侧边栏中的NinGoo’s shared items,风格已经和其他部分统一,完美的融为一体^_^
另外,css对于li还有另外一个属性display,如果设置为inline,则可以将全部列表在一行中显示,这在将列表做为导航菜单的时候也许能用到。