CSSは位置+マージンを使用して、固定ボックスの水平および垂直の中央揃えの方法を実現します。
|
margin:auto; + position: absolute; 上、下、左、右:0
<!DOCTYPE html>
<html>
<ヘッド>
<meta http-equiv="コンテンツタイプ" コンテンツ="text/html; charset=UTF-8">
<メタ文字セット="utf-8">
<meta name="ビューポート" content="初期スケール=1.0、最大スケール=1.0、ユーザースケーラブル=いいえ" />
<title>位置 + マージンを使用してボックスを水平方向と垂直方向に固定します</title>
<スタイル>
体 * {
アウトライン: 1px #ff0000 実線;
}
。父親 {
幅: 500ピクセル;
高さ: 300px;
位置: 相対的;
}
.父 .息子 {
幅: 180ピクセル;
高さ: 140px;
/* */
位置: 絶対;
右: 0;
下部: 0;
上: 0;
左: 0;
マージン: 自動;
}
</スタイル>
</head>
<本文>
<div class="父">
<div class="son">margin:auto + 上、下、左、右:0</div>
</div>
</本文>
</html>//終わり CSS で位置 + マージンを使用して固定ボックスの水平および垂直の中央揃えを実現する方法については、これで終わりです。CSS で固定ボックスの水平および垂直の中央揃えに関する関連コンテンツの詳細については、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。 |
<<: DockerはMysql、.Net6、Sqlserverなどのコンテナをデプロイします
>>: Sublime Text - ブラウザのショートカットキーを設定するための推奨方法
推薦する
Linux gzip コマンドのファイル圧縮実装原理とコード例
gzip は、Linux システムでファイルの圧縮と解凍によく使用されるコマンドです。このコマンドで...
CSS でマウスの位置をマッピングし、マウスを動かしてページ要素を制御する (サンプル コード)
マウスの位置をマッピングしたり、ドラッグ効果を実装したりすることは、 JavaScriptで行うこと...
MySQLデータベーストリガーの詳細な説明
目次1 はじめに2 トリガーの紹介3 トリガーを作成する4 トリガーを表示5. トリガーの削除6 結...
docker+jenkins+node.js の自動デプロイメント環境をゼロから構築する方法
このケースはCentOS 7システムに基づいていますDockerの使用経験がある人に適していますLi...
Docker はキューとタスクのスケジューリングを実現するために Laravel アプリケーションをデプロイします
前回の記事では、Docker を使用して Laravel アプリケーションをデプロイする方法について...
MySQL 文字列分割操作 (区切り文字を含む文字列のインターセプション)
区切り文字なしの文字列抽出質問の要件データベース内のフィールド値:実装効果: 1行のデータを複数行に...
TypeScript における列挙型の理解と応用シナリオ
目次1. 何ですか2. 使用数値列挙文字列列挙異種列挙自然3. 応用シナリオ要約する1. 何ですか列...
Linux システムに 3 つ以上の Tomcat をインストールする (詳細な手順)
複数のTomcatをインストールする場合は、システムにJDKがインストールされている必要があり、 T...
Nginxはctxを使用してデータ共有とコンテキスト変更機能を実現します。
環境: init_worker_by_lua、set_by_lua、rewrite_by_lua、a...
MySQL よく使われる関数の詳細な概要
目次MySQL 共通関数1. 数値関数文字列関数3. 時間機能4. システム機能5. 集計関数MyS...
ルート権限なしでログインするためのDockerソリューション
docker コマンドを初めて使用する場合、権限の問題を確認するメッセージが表示されます。 unix...
Dockerはローカルイメージをパッケージ化し、他のマシンに復元します
1. docker imagesを使用して、このマシン上のすべてのイメージファイルを表示します。 2...
MySQL インデックスのクイックガイド
MySQL インデックスの確立は、MySQL の効率的な操作にとって非常に重要です。インデックスによ...
CSS 境界線の長さ制御機能の実装
以前は、境界線の長さをコンテナーよりも小さくする必要があったときに、div ネストを使用していました...
史上最も簡単な MySQL データのバックアップと復元のチュートリアル (パート 2) (パート 37)
データのバックアップと復元パート3の詳細は次のとおりです基本的な概念:バックアップ、現在のデータまた...