HTMLのインライン要素とブロック要素とは何ですか?

htmlインライン要素には、a (アンカー要素)、b (太字)、br (改行)、code、em (強調)、font (フォント設定)、i (斜体)、img (図)、 input (入力ボックス)、span、strong (太字強調)、textarea、u など; ブロック要素には、address (アドレス)、blockquote (ブロック引用符)、center (中央揃えのブロック)、div、h1~h6 (タイトル）、hr（水平分割線）、p、ul、olなど

このチュートリアルの動作環境: Windows 7 システム、HTML5 バージョン、Dell G3 コンピューター。

インライン要素とブロック要素の説明

CSS 仕様によれば、Web ページの各要素には要素の種類を決定するために使用される表示属性があります。 . , 各要素にはデフォルトの表示属性値があります。たとえば、div 要素のデフォルトの表示属性値は「block」で、「ブロックレベル」要素になります。一方、span 要素のデフォルトの表示属性値は「inline」です。 「. 」は、「インライン」要素と呼ばれます。

div などのブロックレベルの要素は、特定の長方形のスペースを自動的に占有します。高さ、幅、内側と外側の余白などの属性を設定することで、この長方形の外観を調整できます。逆に、「span」のように、 " "a" のようなインライン要素は、独自の独立したスペースを持たず、他のブロックレベル要素に付随して存在します。そのため、インライン要素に対する高さ、幅、内マージン、外マージンなどの属性の設定は無効です。

インライン要素とブロック要素の違い:

(1). ブロックレベルの要素は排他的な行を占有し、その幅は自動的にその要素の幅を埋めます。親要素
インライン要素 排他的な行を占有しません。隣接するインライン要素は同じ行に配置されます。1行に収まらないまでは改行されません。幅は要素の内容によって変わります
(2). 一般に、ブロックレベルの要素は幅、高さの属性を設定でき、インライン要素は幅、高さを設定できます。無効です
(注: ブロックレベルの要素の幅が設定されている場合でも、依然として排他的行)
(3). ブロックレベル要素はマージンとパディングを設定できます インライン要素 水平方向のパディング左、パディング右、マージン左、およびマージン右はすべてマージン効果を生み出しますが、垂直方向のパディング- top、padding-bottom、margin-top、および margin-bottom はエッジを生成しません。 (横方向は有効、縦方向は無効)

ブロック要素(ブロック要素)

* address - address

* blockquote -ブロック引用

* center - 中央揃えのブロック

* dir - ディレクトリ リスト

* div - 一般的に使用されるブロック レベル、CSS レイアウトのメイン タグでもあります

* dl - 定義リスト

* フィールドセット - フォーム コントロール グループ

* フォーム - インタラクティブ フォーム

* h1 - タイトル

* h2 -サブタイトル

* h3 - レベル 3 の見出し

* h4 - レベル 4 の見出し

* h5 - レベル 5 の見出し

* h6 - レベル 6 の見出し

* hr - 水平区切り線

* isindex - 入力プロンプト

* menu - メニュー リスト

* noframes - オプションのコンテンツをフレーム化します (閲覧用)フレームをサポートしていません ブラウザはこのブロックのコンテンツを表示します

* noscript - オプションのスクリプトコンテンツ (このコンテンツはスクリプトをサポートしていないブラウザに表示されます)

* ol - ソートフォーム

* p - 段落

* 事前にフォーマットされたテキスト

* table - テーブル

* ul - ソートされていないリスト

#Inline 要素 (インライン要素)

* a - アンカーポイント

* abbr - 略語

* 頭字語 - 最初の単語

* b - 太字 (非推奨)

* bdo - Bidi オーバーライド

* big - 大きなフォント

* br - 改行

* cite - quote

* code - コンピュータコード (ソースコードを引用する場合に必要) * dfn - 定義フィールド

* em - 強調

* font - フォント設定 (非推奨)

* i - イタリック体

* img - 画像

* input - 入力ボックス

* kbd - キーボード テキストの定義

* label - テーブルlabel * q - 短い引用符

* s - アンダースコア (推奨されません)

* samp - サンプル コンピューター コードを定義します

* select - 項目の選択

* small - 小さいフォントのテキスト

* スパン - 一般的に使用されるインライン コンテナ、テキスト内のブロックを定義します

* 取り消し線 - 下線

* 強 - 太字の強調

* sub - 下付き文字

* sup - 上付き文字

* textarea - 複数行のテキスト入力ボックス

* tt - テレックス テキスト

　　* u - 底線   

　　* var - 定義變數   

可變元素   

　　可變元素為依據情境情境決定此元素為依據情境情境決定此元素為依據情境情境決定此元素為依據情境情境決定該元素為依據情境情境決定該元素為依據情境情境決定該元素為依據情境情境決定該元素為依據情境情境決定該元素為依據情境情境決定該元素為依據情境情境決定此元素為依據情境情境決定為塊元素或內聯元素。

　　* applet - java applet   

　　* button - 按鈕   

　　* del - 刪除文字* 

#　　* del - 刪除文字ins - 插入的文字   

　　* map - 圖片區塊(map)   

　　* object - 圖片區塊(map)   

　　* object - object物件   

　* script - object物件   

##　* script - 客戶端腳本* script - 客戶端腳本# 推薦：《

html影片教學》

以上がHTMLのインライン要素とブロック要素とは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。