スペースをください

それを行うには、あらゆる種類の方法があります。もちろん、他の状況よりも特定の状況に適したものがあります。

HTMLで直接それを行うことができます：

 <p> 1つの行から行きます... <br> <br>さらに数回。</p>

しかし、それはCSSのためのものです：

 <p> 1つの行から行きます... <span>さらに数回。</span> </p>

スパン{
  表示：ブロック;
  マージンブロックスタート：1.5rem;
}

ラインの高さは、テキストのライン間の余分な呼吸室を与えることもできます。

 p {
  ラインハイト：1.35;
}

私たちはテキストを話しているので、テキストインデントは言うまでもなく、文字間隔と単語間隔もあります。

しかし、テキストの代わりに箱を話しましょう。 2つの単純なDIVがあるとします：

 <div> twiddle dee </div>
<div> twiddle dum </div>

これらはブロックレベルなので、すでに異なるラインにあります。再びマージンに手を伸ばすことができます。または、パディングでスペースの印象を作成することもできます。これらの吸盤をどちらの方向にも翻訳できると思います。

 div：nth-​​child（2）{
  変換：翻訳（100px）;
}

しかし、これらの要素は絶対に配置されているため、物理的なオフセットを使用できます。

 div {
  位置：絶対;
}
div：nth-​​child（1）{
  挿入図：0;
}
div：nth-​​child（2）{
  Inset-Inline-Start：100px; /*またはトップ：100px; */
}

グリッドコンテナで作業している場合は、ギャップエージを取得します。

 <section>
  <div> twiddle dee </div>
  <div> twiddle dum </div>
</section>

セクション {
  ディスプレイ：グリッド;
  Grid-Template-Columns：1FR 1FR;
  ギャップ：100px;
}

柔軟なコンテナと同じ取引：

セクション {
  ディスプレイ：Flex;
  ギャップ：100px;
}

グリッドと柔軟なコンテナで作業している間、アライメントプロパティを呼び出してスペースを生成することができます。

セクション {
  ディスプレイ：Flex;
  Align-Items：space-bet-bether;
  justify-content：space-bethed;
}

もちろん、テーブルがあります：

twiddle dee

Twiddle Dum

またはCSS-Yアプローチ：

 /*テーブル要素で作業していない場合は、「表示：テーブル」を使用できます。 */
テーブル {
  境界面積：100px;
}

左フィールドに深く入りましょう。ハードカラーストップで線形勾配を使用して、1つの要素を2つのように見せることができます。

 div {
  背景イメージ：
    線形勾配（
      右に、
      RGB（255 105 0 /1）50％、
      RGB（207 46 46 /1）50％、
      RGB（207 46 46 /1）100％
    ）;
}

次に、ヘッドフェイクを行い、2つの色の間に硬い透明なカラーストップを挿入します。

私たちがここのベーコンをファキンベーコンである限り、olの「透明な」ボーダートリックに投げるかもしれません：

しばらくテキストに戻りましょう。たぶん私たちは要素を浮かんでおり、テキストがそれを包み込むことを望んでいます... 2つの間にあるスペースを残しながら、浮かんだ要素の形で。そのための形状があります：

spacer.gif日についても言及しますか？

 <div> twiddle dee </div>
<img  src="spacer.gif" alt="スペースをください" > 
<div> twiddle dum </div>

もっと必要です

あなたはすべて素晴らしいアイデアを持つスマートな束です。それに持って！

以上がスペースをくださいの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。