HTMLでタグの位置を設定する方法-htmlチュートリアル-php.cn

HTMLでタグの位置を設定する方法

青灯夜游

リリース： 2021-12-13 15:43:45

オリジナル

10976 人が閲覧しました

設定方法: 1.相対配置の場合はaタグの親タグに「position:relative;」スタイルを追加; 2.絶対配置の場合はaタグに「position:absolute;」スタイルを追加; 3. 使用 top、bottom、left、right 属性は、ラベルの位置を制御します。

HTMLでタグの位置を設定する方法

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

HTML では、position 属性を使用して a タグの位置を設定できます:

「position:relative;」スタイルを親タグに追加します。相対配置の a タグ;
絶対配置の a タグに「position:Absolute;」スタイルを追加します。
ラベルの位置を制御するための、top、bottom、left、および right 属性。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<style>
			div{
				width: 300px;
				height: 200px;
				background-color: yellow;
				position: relative;
			}
			a{
				position: absolute;
				top: 50px;
				left: 50px;
			}
		</style>
	</head>
	<body>
		<div>
			<a>我是一个a标签</a>
		</div>
	</body>
</html>

ログイン後にコピー

HTMLでタグの位置を設定する方法

説明:

position 属性は、要素の位置 (静的、相対、絶対、または固定) を指定します。 ) 測位方法のタイプ。

relative: 通常の位置を基準にして、相対的に配置された要素を生成します。したがって、「left:20」は要素の LEFT 位置に 20 ピクセルを追加します。
absolute: 静的な配置以外に、最初の親要素を基準にして配置される絶対配置要素を生成します。要素の位置は、「left」、「top」、「right」、「bottom」属性によって指定されます。

推奨チュートリアル: 「html ビデオチュートリアル」

以上がHTMLでタグの位置を設定する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。