21

<br/>最近では、タグがほとんどまたはまったくない多くの Web サイトを目にします。CSS は の必要性をなくしました<br/>か、それとも<br/>まだ有用ですか?

将来的に使用するかどうかを知るために、これを尋ねて<br/>います。

4

4 に答える 4

26

DA が言ったように、<br>適切な場合とそうでない場合があります。それは、使用目的によって異なります。が適切でない場合に、 の代わりに使用する CSSの例を次に示します。<br><br>

垂直マージンまたはパディング

<br>(改行がコンテンツの一部であるという理由ではなく) 見栄えが良いという理由だけで垂直方向のスペースを追加するために使用している場合は、垂直方向のマージンまたはパディングを使用する必要があります。これの代わりに：

<div class="foo">some content</div>
<br><br>
<div class="bar">more content</div>

あなたはこれが欲しいかもしれません：

<div class="foo">some content</div>
<div class="bar">more content</div>

.foo { margin-bottom: 2em; }

状況に応じて、距離を変更したり、 の代わりに2em使用したり、 の下部ではなく の上部にスペースを入れたりすることができます。paddingmargin.bar.foo

display: block

視覚効果のためだけに線を 2 つに分割するために 1 つの を使用している場合は、<br>を使用する方がよい場合がありますdisplay: block。フォームにこの HTML がある場合:

<label for="first-name">First name:</label>
<br>
<input type="text" id="first-name" name="first-name" />

次に、代わりに次のようにする必要があります。

<label for="first-name">First name:</label>
<input type="text" id="first-name" name="first-name" />

form label { display: block; }

<label>s はdisplay: inlineデフォルトであり、他のテキストと並んで配置できることを意味します。要素を作成し、その要素を のような固定値にdisplay: block設定しない場合、要素は展開されて行全体を埋め、その後の要素を次の行に強制します。width100px

于 2013-07-05T18:46:45.940 に答える
14

<br>有効なタグです。しかし、それは単なるラインブレイクです。通常、コンテンツをフォーマットするために使用する意味的に意味のあるタグがはるかに多いため、改行は必要ありません。しかし、それはすべて文脈に依存します。

<br>タグの特定の使用法が理にかなっている場合は、お問い合わせください。使用方法のいくつかの例を投稿します。

于 2013-07-05T17:26:32.540 に答える
9

<br>タグは問題なく使用できますが、適切に使用してください。余分なスペースを確保するために複数を使用していることに気付いた場合は、代わりに css を使用する必要があります。タグの一般的な用途は<br>、住所などを挿入する場合です。

<p>Company Name<br>
Address Line 1<br>
Address Line 2<br>
City, State, Zip</p>

複数の改行が必要な場合は、css でマージンまたはパディングを使用してください。

こんなことしないで

<p>some paragraph text</p>
<br><br><br>
<p>more content</p>
于 2013-07-05T17:40:41.270 に答える
5

コンテンツに改行が含まれている<br>場合に使用します。いくつかのケースがあります:

  • フォーラムで、投稿者が自分の投稿に署名した場合:

    <p>See you,<br>Jon Doe<br>

  • 住所の場合<div>、名前、通り、州などにそれぞれ独自のクラスを持つ専用の sを使用するのはやり過ぎです。

    <p>Jon Doe<br>Sunrise Avenue 123<br>Saint Nowhere</p>

  • より一般的には、ユーザーが書式設定されたテキストを入力できる場合、誰かが 1 つの改行を入力します。

于 2013-07-05T20:43:26.933 に答える