1

私は HTML5 を使用して自分の Web ページを作成しています (ただし、おそらく私が求めていることは 5 とは関係ありません)。私はそこにインデントを入れようとしています。

<ol>
  <li> <fontspec from css>title</fontspec from css> detail about title
  </li>
  <li>..</li>
  ...
</ol>

私が欲しいのは、「タイトルについての詳細」が次の行に表示され（私はそのために使用brしています）、意図されていることです。なので

1. title
     detail about title

space を使用して効果を得ることができますが、&nbspすべてのページについて、入力しているすべてのスペースの数を覚えておく必要があります。私のためにこれらのことを行うタグはhtmlにありますか?

編集：

返信ありがとうございます。インデントは機能していますが、通常どおり<p>、これは次の行に書き込むのではなく、1 行余分にギャップをとっています。現在、次のようになっています。

1. title

   detail about title

EDIT2

実際のページのスニペットは次のとおりです。

Html で:

<ol>
      <li>
      <item>title</item><p class="indent">details about title</p>
      </li>
</ol>

CSSで：

item{
  font-size :120%;
  color     :#096cdb;
  font-weight : bold;
}
.indent{
  margin-left: 20px;
}

* jukka のコメントとして編集* theat item が html タグではないことに気付きました。w3cバリデーターはエラーを出していますが、クロムは私の意図どおりにレンダリングしています。アイテムの代わりに h4 を入れようとしましたが、次の行のスペースも取っています。それで、抜け道は何ですか？

編集：

仕事を解決しました。

私はcssで定義しました：

dt.item{
  font-size :120%;
  color     :#096cdb;
  font-weight : bold;
}

そして、次のことを行いました：

  <li>
  <dl>
<dt class="item">title</dt>
<dd>details about title</dd>
  </dl>
  </li>

これには私が探している出力があり、w3c によっても検証されています。

4

3 に答える 3

0

まず、クラスを与えましょう。

<p class="indent">detail about title</p>

その後、CSS を使用して、テキストの左側に余白を設定します。

.indent {
   margin-left: 20px;
}

それはあなたにインデントを与えるはずです。それに応じて調整します:)

段落要素を使用すると、改行が不要になることに注意してください。

于 2013-09-13T10:11:15.067 に答える