Actions日本語このページはコミュニティーの尽力で英語から翻訳されました。コミュニティーについてもっと知り、仲間になるにはこちらから。通常フローでのブロック及びインラインレイアウトこのガイドでは、通常フローの中でブロック及びインライン要素がどのように動作するかの基本を見てみます。仕様書で定義されており、通常フロー内のあらゆるボックスが整形コンテキストの一部になることを説明しています。ブロックかインラインのどちらかになることができますが、同時に両方になることはできません。ブロック整形コンテキストに参加するものをブロックレベルボックス、インライン整形コンテキストに参加するものをインラインレベルボックスと呼んでいます。ブロックまたはインライン整形コンテキストを持つ要素の動作は、この仕様書でも定義されています。ブロック整形コンテキストを持つ要素については、仕様書では以下にように言っています。“ブロック整形コンテキストでは、ボックスは次々と垂直に、包含ブロックの上からレイアウトされます。プロパティで指定されます。ブロック整形コンテキストにおいて、隣り合うブロックレベルボックスの間の垂直マージンは相殺されます。(右書きの整形では、右端が接します)。9.4.1インライン整形コンテキストを持つ要素については以下の通りです。“インライン整形コンテキストでは、ボックスは包含ブロックの上から次々と水平に、レイアウトされます。これらのボックスの間では、水平マージン、境界、パディングが尊重されます。ボックスは垂直方向には様々な方法で配置されます。下や上に配置されたり、テキストのベースラインに配置されたりします。行を形成するボックスを含む矩形の領域は行ボックスと呼ばれます。仕様書では、横書きで上から下へ向かう書字方向の文書を説明しています。ブロックボックス間を垂直距離によって説明しています。ブロックおよびインライン要素の動作は、縦書きの書字方向でも同様に動作するものであり、今後のフローレイアウトと書字方向のガイドで明らかにする予定です。下方向にレイアウトされます。書字方向が縦書きである場合は、水平方向にレイアウトされるでしょう。このガイドでは、英語、すなわち横書きモードでの作業となります。文書が縦書きの場合でも、説明したことはすべて同じように動作するはずです。つのブロックボックスの間のマージンは、要素間に区切りを作るものです。つの段落から成るとても単純なレイアウトで、境界を追加したところに見ることができます。既定ののブラウザースタイルシートでは、上下にマージンを追加することで、段落間の間隔が追加されています。すると、境界線が接触します。既定では、ブロック要素はインライン方向の空間をすべて消費するので、段落は広がり、包含ブロックの中で可能な限り大きくなります。ブロック要素に幅を設定した場合、段落が横に並ぶ空間があったとしても、段落は下へ下へと配置されます。それぞれは包含ブロックの先頭側の反対側から始まりますので、その書字方向で文章が始まる場所になります。仕様書では、ブロック要素間のマージンは相殺されると説明されています。つのマージンのうち大きい方のマージンと同じくらいの大きさになるということです。