css – 如何在内联有序列表中显示数字?

前端之家收集整理的这篇文章主要介绍了css – 如何在内联有序列表中显示数字?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个清单..
  1. <ol>
  2. <li>Login</li>
  3. <li>Address</li>
  4. <li>Shipping</li>
  5. </ol>

显示十进制数,但是当我设置< li>内嵌或内嵌阻塞,数字消失!我看到其他地方在线提到,我必须确保我有足够的空白和填充..我确信我做(每个10像素).还有其他原因数字可能会消失吗?我知道从firebug,一旦我取消勾选“内联”他们回来了…

css是

  1. ol{
  2. padding: 20px;
  3. list-style-type:decimal;
  4. }
  5. ol li {
  6. display: inline;
  7. margin: 0 10px;
  8. padding: 0 10px;
  9. }

解决方法

我不知道为什么会发生这种情况,但是它可以通过浮动而不是显示:inline来解决

http://www.jsfiddle.net/CMKzK/

  1. ol{
  2. padding: 20px;
  3. list-style-type:decimal;
  4.  
  5. }
  6. ol li {
  7. float:left;
  8. margin: 0 10px;
  9. padding: 0 10px;
  10. }

猜你在找的CSS相关文章