html – 左对齐列表编号和文本

前端之家收集整理的这篇文章主要介绍了html – 左对齐列表编号和文本前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想在我的< ol>中左对齐数字和文字.这就是我想要完成的事情:

目前,每个< li>包含< a>,但可以更改.到目前为止,我尝试在左边填充,然后在< a>上进行文本缩进.

这是我现在的代码.

HTML

<ol class="dinosaurs">
    <li><a>Dinosaur</a></li>
    <li><a>Tyrannosaurus</a></li>
    <li><a>Camptosaurus</a></li>
</ol>

CSS:

.dinosaurs{
    list-style-position: inside;
}

注意:我正在Windows 7上的Chrome 23中查看网页.

解决方法

您可以像这样定位列表元素:
.dinosaurs {
  list-style-position: inside;
}

.dinosaurs li{
  position: relative;
}
.dinosaurs li a {
  position: absolute;
  left: 30px;
}

这将产生http://jsfiddle.net/wBjud/2/

原文链接:https://www.f2er.com/html/226633.html

猜你在找的HTML相关文章