スパンはHTMLのブロック要素ですか？-フロントエンドQ&A-php.cn

ホームページ

ウェブフロントエンド

フロントエンドQ&A

スパンはHTMLのブロック要素ですか？

青灯夜游

Nov 17, 2021 pm 05:36 PM

html span ブロック要素インライン要素

HTML では、span はブロック要素ではなく、インライン要素 (inline 要素) です。 scan 要素は主にテキストを収容するために使用されます。span 要素は 1 行に複数表示できます。span 要素の幅と高さは内容によって決まり、width 属性と height 属性で設定することはできません。ブロック要素は専用行を占有し、幅と高さを設定できます。

スパンはHTMLのブロック要素ですか？

このチュートリアルの動作環境: 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>

ログイン後にコピー

スパンはHTMLのブロック要素ですか？

複数のスパン要素を 1 行に表示でき、スパンの幅と高さを指定できることがわかります。要素は包括的です。コンテンツによって決定されます。幅と高さの属性は設定できません。これらはインライン要素の特徴です。

ブロックレベルの要素

ブロックレベルの要素の表示属性は通常ブロックです。なぜ通常と言うのですか? li は list で、-item と table の表示属性は table ですが、これらはすべてブロックレベルの要素です。

ブロックレベル要素の特徴

ブロックレベル要素は排他的な行を占有します
要素は幅、高さ、行の高さ、マージン、パディングを設定できます。
#なぜブロックレベルの要素が独自の行を占有する必要があるのですか?ブロックレベル要素の幅は親要素の幅全体を占めるため、他の要素を表示するための余分なスペースはなく、新しい行を開始することしかできません。

一般的なブロックレベル要素は次のとおりです:

<div>
<p>
<h1>~<h6>
<ol>
<ul>
<dl>
<table>
<address>
<blockquote>
<form>

ログイン後にコピー

インライン要素

インライン要素の表示属性は次のとおりです: inline

インライン要素の特徴

他のインライン要素と 1 行に並べて表示;

##要素の幅と高さは設定できませんが、行の高さは設定できます。Line-height
要素の幅は、要素の幅です。含まれるテキストまたは画像は変更できません。
#インライン要素はテキストまたはその他のインライン要素のみを収容できます
インライン要素は水平方向のマージンを設定できますが、垂直方向のマージンは設定できません。、内側のマージンパディングは水平方向と垂直方向に設定できます。
一般的なインライン要素:
```
<a>

 



<label>
<q>
<var>
<cite>
<code>
```
ログイン後にコピー
推奨チュートリアル: "html ビデオチュートリアル "
以上がスパンはHTMLのブロック要素ですか？の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明

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