0

我想在第二行的第一行开始显示文本,但它在数字下方的左侧请帮助

1 文本行段落 and and
and and and and and and and and and and and
2 文本行段落 and and
and and and and and and and and and and and
3 文本行段落 and and
and and and and and and and and and and and and and

注意:不使用列表类我想要这种类型的显示文本与 css 请帮助。

4

5 回答 5

2

我假设您的意思是,对于由编号项目组成的文本,其中数字是内容的一部分,每个项目都应该从新行开始,并且项目的第二行和后续行应该左对齐到文本正确的同一点(在数字、句号和空格之后)第一行开始。我还假设“不使用列表类”意味着由于ol某种原因不能使用编号列表的元素。

最简单(也是最强大)的解决方案是使用表格。例子:

<style>
table.list { border-collapse: collapse; }
table.list td { padding: 0; vertical-align: top; }
table.list td:first-child { text-align: right; padding-right: 0.25em; }
</style>
<table class=list>
<tr><td>1.</td><td>Text line paragraph and and and and and and and and and and and and</td></tr>
<tr><td>2.</td><td>Text line paragraph and and and and and and and and and and and and</td></tr>
<tr><td>3.</td><td>Text line paragraph and and and and and and and and and and and and</td></tr>
</table>

如果您需要避免使用table标记,那么您需要以某种方式模拟它,例如使用标记divspanCSS 表格格式(display: table等)——在现代浏览器中有效,但在旧版本的 IE 中无效。

现场演示

于 2012-12-12T06:39:50.677 回答
1

如果它只是你之后的缩进,你可以这样做:

p {
  padding-left: 1em;
  text-indent: -0.75em;
}

根据字体,您可能需要text-indent稍微调整该值。

http://jsfiddle.net/h7KvC/

于 2012-12-12T07:32:09.267 回答
0

在 css 中使用 text-indent 和 clear ,希望它能解决您的问题。

于 2012-12-12T06:00:45.900 回答
0

用它做一个ol..

<ol>
<li>Text</li>
<li>Text</li>
<li>Text</li>
</ol>

结果 :

  1. 文本行段落 and and
    and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and
  2. 文本行段落 and and
    and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and
  3. 文本行段落 and and
    and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and and
于 2012-12-12T07:28:41.070 回答
-1

您可以通过这种方式将段落添加到列表项中:

HTML

<div class="list">
  <p>Paragraph one</p>
  <p>Paragraph two</p>
  <p>Paragraph three</p>
</div>

CSS

.list {
  counter-reset: pcount;
}
.list p:before {
  counter-increment: pcount;
  content: counter(pcount, decimal) ' ';
}

结果

1 Paragraph one
2 Paragraph two
3 Paragraph three

http://jsfiddle.net/bQWau/1/

于 2012-12-12T06:33:24.813 回答