『CSS 決定版ガイド』中国語: ブロックレベル要素ではない表示要素はすべてインライン要素です。そのパフォーマンスの特徴は「列レイアウト」という形式です。ここでの「列レイアウト」とは、その表現形式が常に列で表示されることを意味します。たとえば、インライン要素 border-bottom:1px Solid #000; を設定すると、それが各行で繰り返され、各行の下に細い黒い線が表示されます。ブロックレベル要素の場合、表示される黒い線はブロックの下にのみ表示されます。
p、h1、div などの要素はブロック レベル要素と呼ばれることが多く、これらの要素はコンテンツのブロックとして表示されます。Strong やspan などの要素はインライン要素と呼ばれ、そのコンテンツは行内に表示されます。 、「インラインボックス」。 (display=block を使用して、インライン要素をブロック要素に変換できます。display=none は、生成された要素にフレームがまったくなく、要素が表示されず、ドキュメント内のスペースも占有しないことを意味します)
A: インライン要素は行内の要素であり、行内にのみ配置できます。ブロックレベルの要素は単なる 4 つの正方形のボックスであり、ページ上のどこにでも配置できます。
B: 率直に言うと、インライン要素は単語のようなもので、ブロックレベルの要素は、特に定義されていない場合は単独の行に表示されます。
C: 段落 <p>、タイトル <h1><h2>...、リスト、<ul><ol><li>、テーブル <table>、フォーム <form>、DIV<div などの一般的なブロック レベルの要素> および BODY <body> およびその他の要素。インライン要素には、フォーム要素 <input>、ハイパーリンク <a>、画像 <img>、<span> などがあります。
D: ブロックレベル要素の注目すべき特徴は、各ブロックレベル要素が新しい行で表示を開始し、後続の要素も新しい行に表示する必要があることです。
E: <span> は CSS 定義のインライン要素ですが、<div> はブロックレベルの要素です。
コンテナという単語を使用すると、その存在と目的が視覚的に理解しやすくなります。インライン要素は小さなコンテナに相当し、<div> は大きなコンテナに相当します。もちろん、小さなコンテナを大きなコンテナに配置することもできます。 <span> は小さなコンテナです。
ブロック要素は通常、他の要素のコンテナ要素です。ブロック要素は通常、インライン要素と他のブロック要素を収容できます。ブロック要素の「form」は比較されます。特別に、他のブロック要素を含めるためにのみ使用できます。
CSS を使用しないと、ブロック要素は一度に 1 行ずつ配置されます。 CSS を使用すると、この HTML のデフォルトのレイアウト モードを変更し、必要な場所にブロック要素を配置できます。愚かにも毎回新しい行を始めるのではなく。 table タグもブロック要素の一種であることに注意してください。Table ベースのレイアウトと CSS ベースのレイアウトは、これら 2 つのレイアウトを一般ユーザー (視覚障害者、視覚障害者などを除く) の観点から見たものです。ページの読み込み速度の違い以外に違いはありません。ただし、一般のユーザーが誤って「ページのソース コードを表示」ボタンをクリックした場合、この 2 つの違いは非常に大きくなります。優れた再構築コンセプトに基づいて設計された CSS レイアウト ページのソース コードにより、少なくとも Web 開発の経験のない一般ユーザーでもコンテンツをすぐに理解できるようになります。この観点から、CSS レイアウト コードはより優れた審美性を備えている必要があります。
ブロック コンテナー要素 div をボックスとして考えることができます。クリッピングを使った経験がある場合は、理解しやすいでしょう。まず、さまざまな新聞や雑誌から必要な記事を切り出します。カットされたコンテンツのそれぞれがブロックです。次に、レイアウトの意図に従って、これらの紙を新しい白紙に貼り付けます。これにより、独自の要約が作成されます。テクノロジーの拡張として、Web レイアウト設計も同じパターンに従います。
インライン要素は通常、セマンティック レベルの基本要素に基づいています。インライン要素はテキストまたはその他のインライン要素のみを保持できます。共通のインライン要素は「a」です。
ブロック要素(block element)とインライン要素(inline element)は、HTML仕様における概念です。ブロック要素とインライン要素の基本的な違いは、ブロック要素は通常新しい行で始まることです。 CSS 制御を追加すると、このブロック要素とインライン要素の属性の違いは違いになりません。例えば、inline要素のciteにdisplay:blockのような属性を追加することで、毎回改行するという属性も持たせることができます。
可変要素の基本概念は、要素がブロック要素であるかインライン要素であるかをコンテキストに基づいて判断する必要があるということです。変数要素は、引き続き上記の 2 つの要素カテゴリに属します。コンテキストによってそのカテゴリが決定されると、ブロック要素またはインライン要素の規則に従う必要があります。大まかな要素の分類については全文を参照してください。
ps: インライン要素の中国語名についてですが、インライン要素、インライン要素、インライン要素、インライン要素など色々あります。基本的に統一した訳はなく、好きなように呼んでください。さらに、インライン要素について話すときは、display:inline と呼ばれる表示属性について考えます。この属性は、有名な IE の二重フローティング ボーダー (フロート マージン) 問題を解決できます。
ブロック要素
* 住所 - 住所
* blockquote - ブロック引用符
* 中心 - 中心位置合わせブロック
* dir - ディレクトリのリスト
* div - 一般的に使用されるブロックレベルは CSS レイアウトのメインタグでもあります
* dl - 定義リスト
* フィールドセット - フォームコントロールグループ
* フォーム - インタラクティブなフォーム
* h1 - 見出し
* h2 - サブタイトル
*h3 - レベル 3 の見出し
*h4 - レベル 4 の見出し
*h5 - レベル 5 の見出し
*h6 - レベル 6 の見出し
*hr - 水平分割線
* isindex - 入力プロンプト
*menu - メニューリスト
* noframes - オプションのコンテンツをフレーム化します (フレームをサポートしていないブラウザーにはこのブロックのコンテンツを表示します)
*noscript -) オプションのスクリプト コンテンツ (スクリプトをサポートしていないブラウザーにはこのコンテンツを表示します)
*ol - ソートフォーム
* p - 段落
* 事前にフォーマットされたテキスト
*テーブル - テーブル
* ul - ソートされていないリストのインライン要素 (インライン要素)
* a - アンカーポイント
*abbr - 略語
*頭字語 - 頭字語
* b - 太字 (非推奨)
* bdo - 双方向オーバーライド
* 大きい - 大きなフォント
* br - 改行
*引用 - 引用
* code - コンピュータコード (ソースコードを引用する場合に必要)
* dfn - フィールドを定義します
*em - 強調
* フォント - フォント設定 (非推奨)
* i - 斜体
* img - 画像
* 入力 - 入力ボックス
* kbd - キーボードテキストを定義します
* ラベル - テーブルラベル
*q - 短い引用符
* s - ダッシュ (非推奨)
* samp - サンプル コンピューター コードを定義します。
* select - 項目の選択
* 小 - 小さなフォントのテキスト
* スパン - テキスト内のブロックを定義するために一般的に使用されるインライン コンテナー
* ストライク - センターライン
*strong - 太字で強調
*サブ - 添え字
* sup - 上付き文字
* textarea - 複数行のテキスト入力ボックス
*tt - テレックステキスト
* u - アンダースコア
* var - 可変の可変要素を定義します。可変要素は、コンテキストに応じてブロック要素またはインライン要素です。
* アプレット - Java アプレット
* ボタン - ボタン
* del - テキストを削除します
* iframe - インラインフレーム
* ins - 挿入されたテキスト
* マップ - 画像ブロック (マップ)
* オブジェクト - オブジェクト オブジェクト
* スクリプト - クライアントスクリプト
人気: 26% [?]