ホームページ >ウェブフロントエンド >htmlチュートリアル >HTMLのブロックレベル要素とは何ですか

HTMLのブロックレベル要素とは何ですか

青灯夜游
青灯夜游オリジナル
2021-03-02 17:04:4210497ブラウズ

HTML では、ブロックレベル要素とは、表示属性がブロックである要素を指します。通常、ブロック レベルの要素は多くのブラウザで 1 行を占めて表示され、同じ行にある他の要素や他の要素は除外されます。ブラウザでは、ブロック 要素は四角形の形で表示され、他の要素が含まれます。

HTMLのブロックレベル要素とは何ですか

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

block 要素は block 要素 (ブロック要素) とも呼ばれ、これに対応するのが inline 要素 (インライン要素) であり、HTML 仕様における概念です。ほとんどの HTML 要素は、ブロックレベル要素またはインライン要素として定義されます。ブロックレベル要素は通常、ブラウザで表示されるときは改行で始まり (そして終わり) ます。

ブロックレベル要素は比較的横暴です。デフォルトでは、毎回 1 行全体を占有し、後続のコンテンツも新しい行に表示する必要があります。例:

    ,

    各ブロックレベル要素は、デフォルトで 1 行の高さを占めます。ブロックレベル要素を行に追加した後は、他の要素を追加できません (float の後を除く)。 2 つのブロックレベル要素を連続して編集すると、それらは自動的に折り返されてページ上に表示されます。ブロックレベル要素は通常、ブロックレベル要素またはインライン要素をネストできます。

    <html>
    <head>
    <style type="text/css">
    p{ 
    border: thin dotted #FF0000;
    }
    div{ 
    border: 1px solid yellow;
    }
    </style>
    </head>
    <body>
    <p>这是一个p元素</p>
    <p>这是一个p元素</p>
    <div>这是一个div元素</div>
    <div>这是一个div元素</div>
    </body>
    </html>

    HTMLのブロックレベル要素とは何ですか

    ブロックレベル要素は通常、構造を編成するためのコンテナとして表示されますが、常にそうとは限りません。 。

    などの一部のブロック レベル要素には、ブロック レベルの要素のみを含めることができます。他のブロック レベルの要素には、

    などの行レベルの要素を含めることができます。また、他のブロック レベルの要素には、ブロック レベルと行レベルの要素の両方を含めることができます。

    DIV は最も一般的に使用されるブロック レベルの要素であり、display:block 要素スタイルはすべてブロック レベルの要素です。それらは常にブロックの形で表現され、同じレベルの兄弟ブロックと順に縦に並べられ、左右を埋めていきます。

    ブロック要素の特徴

    ①、常に新しい行から開始;

    ②、高さ、行の高さ、外端 スペースとパディングの両方制御可能;

    ③. 幅が設定されていない限り、幅はデフォルトでコンテナの 100% になります。

    ④. インライン要素やその他のブロック要素に対応できます

    [推奨チュートリアル: "html ビデオ チュートリアル "]

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

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。