ブロック要素ブロック要素とインライン要素インライン要素_CSS/HTML

ブロックレベルの要素をインラインレベルの要素に挿入しようとしました。これは許可されていません。ブロックレベル要素をインライン要素に挿入できる唯一の例外は、object タグです。では、インラインレベルの要素とブロックレベルの要素とは何でしょうか? 。

ブロック要素は通常、新しい行で始まります。一般的なブロック要素は段落タグ「P」です。 " ブロック要素は特別です。他のブロック要素を収容するためにのみ使用できます。

CSS の機能がなければ、ブロック要素は一度に 1 行に配置されます。CSS を使用した後、デフォルトを変更できます。この HTML のレイアウト モードを変更して、ブロック要素を必要な場所に配置します。毎回新しい行を開始するのではなく、一般ユーザーの観点から (視覚的には除く)、テーブル タグもブロック要素であることに注意してください。障害のある人、目の見えない人など）、ページの読み込み速度の違いを除いて、テーブルベースのレイアウトと CSS ベースのレイアウトには違いはありません。しかし、通常であれば、ユーザーが誤ってページのソースコードを表示するボタンをクリックした後、この 2 つの違いは非常に大きく、適切な再構築コンセプトに基づいて設計された CSS レイアウト ページのソース コードは、少なくとも Web 開発の経験のない一般ユーザーでもコンテンツをより簡単に理解できるようになります。

ブロックコンテナー要素 div をボックスとして想像するか、クリッピングで遊んだことがある場合は、最初にさまざまな新聞から必要な記事を切り取って考えると理解しやすいでしょう。各カットの内容はブロックであり、これらの紙を独自のレイアウトの意図に従って配置し、新しい空白の紙に貼り付けます。これにより、独自のダイジェストが作成されます。

インライン要素 ( インライン要素は通常、セマンティック レベルの基本要素に基づいています。インライン要素はテキストまたはその他のインライン要素のみを収容できます。共通のインライン要素「a」 」。

Block 要素と inline 要素はどちらも HTML 仕様における概念です。ブロック要素とインライン要素の基本的な違いは、ブロック要素は通常新しい行で始まることです。 CSS 制御を追加すると、このブロック要素とインライン要素の属性の違いは違いになりません。例えば、inline要素のciteにdisplay:blockのような属性を追加することで、毎回改行するという属性も持たせることができます。


可変要素の基本概念は、要素がブロック要素であるかインライン要素であるかをコンテキストに基づいて決定する必要があるということです。変数要素は、引き続き上記の 2 つの要素カテゴリに属します。コンテキストによってそのカテゴリが決定されると、ブロック要素またはインライン要素の規則に従う必要があります。大まかな要素の分類については全文を参照してください。

ps: inline 要素の中国語名については、inline 要素、inline 要素、inline 要素、inline 要素などさまざまな種類があります。基本的に統一した訳はなく、好きなように呼んでください。さらに、インライン要素について話すときは、display:inline と呼ばれる表示属性を思い浮かべます。この属性は、IE の二重浮動境界線の問題を解決できます。

ブロック要素
* address - アドレス
* blockquote - ブロック引用符
* center - アライメントブロック
* dir - ディレクトリリスト
* div - 一般的に使用されるブロックレベルは次のとおりです。簡単で、CSS レイアウトの主要なタグでもあります
* dl - 定義リスト
* フィールドセット - フォーム コントロール グループ
* form - インタラクティブ フォーム
* h1 - ビッグ タイトル
* h2 - サブタイトル
* h3 - レベル 3 タイトル
* h4 - レベル 4 タイトル
* h5 - レベル 5 タイトル
* h6 - レベル 6 タイトル
* hr - 水平分割線
* isindex - 入力プロンプト
* メニュー - メニュー リスト
* noframes - フレームのオプションのコンテンツ (フレームをサポートしていないブラウザの場合は、このブロックのコンテンツを表示します
* noscript -) オプションのスクリプトのコンテンツ (フレームをサポートしていないブラウザの場合)フレームをサポートしています) スクリプトをサポートしていないブラウザはこのコンテンツを表示します)
* ol - ソートされたフォーム
* p - 段落
* 事前にフォーマットされたテキスト
* table - テーブル
* ul -未ソートリスト

インライン要素
* a - アンカーポイント
* abbr - 略語
* 頭字語 - 最初の単語
* b - 太字 (推奨されません)
* bdo - bidi override
* big - 大きなフォント
* br - 改行
* cite - quote
* code - コンピュータコード (ソースコードを引用する場合に必須)
* dfn - フィールドの定義
* em - 強調
* font - フォント設定 (非推奨)
* i - 斜体
* img - 画像
* input - 入力ボックス
* kbd - キーボードテキストの定義
* label - テーブルラベル
* q - 短い引用符
* s - アンダースコア (非推奨)
* samp - サンプルコンピュータコードを定義
* select - プロジェクトの選択
* small - smallフォントテキスト
* スパン - 一般的に使用されるインラインコンテナ、テキストブロックの定義
* 取り消し線 - 下線
* 強 - 太字の強調
* サブ - 一番下 上付き文字
* sup - 上付き文字
* textarea - 複数行のテキスト入力ボックス
* tt - テレックス テキスト
* u - 下線
* var - 変数の定義

変数要素
変数要素は、要素がコンテキストに応じて block 要素または inline 要素を選択します。

* アプレット - Java アプレット
* ボタン - ボタン
* del - テキストの削除
* iframe - インライン フレーム
* ins - 挿入されたテキスト
* マップ - 画像ブロック(マップ)
* オブジェクト - オブジェクト オブジェクト
* スクリプト - クライアント スクリプト