ホームページ >ウェブフロントエンド >フロントエンドQ&A >スパンはHTMLのブロック要素ですか？
スパンはHTMLのブロック要素ですか？
- 青灯夜游オリジナル
- 2021-11-17 17:36:568892ブラウズ
HTML では、span はブロック要素ではなく、インライン要素 (inline 要素) です。 scan 要素は主にテキストを収容するために使用されます。span 要素は 1 行に複数表示できます。span 要素の幅と高さは内容によって決まり、width 属性と height 属性で設定することはできません。ブロック要素は専用行を占有し、幅と高さを設定できます。
このチュートリアルの動作環境: Windows 7 システム、HTML5 バージョン、Dell G3 コンピューター。
span はブロック要素ではなく、インライン要素 (インライン要素) で、主にテキストを収容するために使用されます。スパンはコンテンツ全体を定義するだけで、レイアウトや表示には影響を与えずに操作します。
例:<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
span {
width: 100px;
height: 100px;
}
</style>
</head>
<body>
<span>你好</span> <span>hello</span>
</body>
</html>
ブロック レベルの要素
ブロック レベルの要素の表示属性は通常ブロックです。なぜ通常と言うのですか? li は list で、-item と table の表示属性は table ですが、これらはすべてブロックレベルの要素です。ブロックレベル要素の特徴
- ブロックレベル要素は排他的な行を占有します
- 要素は幅、高さ、行の高さ、マージン、パディングを設定できます。 #ブロックレベルの要素は、親要素 (コンテナ) のスペース全体を占有します。
- インライン要素と他のブロック要素を収容できる
- #なぜブロック レベルの要素が独自の行を占有する必要があるのですか?ブロックレベル要素の幅は親要素の幅全体を占めるため、他の要素を表示するための余分なスペースはなく、新しい行を開始することしかできません。
<div> <p> <h1>~<h6> <ol> <ul> <dl> <table> <address> <blockquote> <form>インライン要素
インライン要素の表示属性は次のとおりです: inline
インライン要素の特徴
他のインライン要素と 1 行に並べて表示;
##要素の幅と高さは設定できませんが、行の高さは設定できます。Line-height
要素の幅は、要素の幅です。含まれるテキストまたは画像は変更できません。
- #インライン要素はテキストまたはその他のインライン要素のみを収容できます
- インライン要素は水平方向のマージンを設定できますが、垂直方向のマージンは設定できません。 、内側のマージンパディングは水平方向と垂直方向に設定できます。
- 一般的なインライン要素:
<a> <span> <br> <i> <em> <strong> <label> <q> <var> <cite> <code>
推奨チュートリアル: " html ビデオ チュートリアル
以上がスパンはHTMLのブロック要素ですか？の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。