0

テキストが1行目から2行目までのテキストを表示したいのですが、数字の下で左側に表示されますpls help

1テキスト行段落andandand and and
and and and and and
and2テキスト行段落andandand and and
and and and and and
andand3テキスト行段落andandand and and
and and and and and and and

注：リストクラスを使用せずに、cssでこのタイプの表示テキストが必要です。助けてください。

4

5 に答える 5

2

番号がコンテンツの一部である番号付きアイテムで構成されるテキストの場合、各アイテムは新しい行で開始し、アイテムの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、何らかの方法でそれをシミュレートする必要があります。たとえばdiv、spanマークアップとCSSテーブルフォーマット（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で両方をクリアして、問題が解決することを期待します。

于 2012-12-12T06:00:45.900 に答える
0

それからolを作ります。

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

結果 ：

  1. テキスト行の段落andandand and and
    and and and and and and and and and and and
  2. テキスト行の段落andandand and and
    and and and and and and and and and and and
  3. テキスト行の段落andandand 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 に答える