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

概述我想在我的< ol>中左对齐数字和文字.这就是我想要完成的事情： 目前,每个< li>包含< a>,但可以更改.到目前为止,我尝试在左边填充,然后在< a>上进行文本缩进. 这是我现在的代码. HTML： <ol class="dinosaurs"> <li><a>Dinosaur</a></li> <li><a>Tyrannosaurus</a></li> <li><a> 我想在我的< ol>中左对齐数字和文字.这就是我想要完成的事情：

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

这是我现在的代码.

HTML：

<ol >    <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/

总结

以上是内存溢出为你收集整理的html – 左对齐列表编号和文本全部内容，希望文章能够帮你解决html – 左对齐列表编号和文本所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。