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 - ブラウザのショートカットキーを設定するための推奨方法
推薦する
HTML でランダムロールコーラーを実装するためのサンプルコード
この点呼装置は簡易版であり、自動停止の必要性を考慮していないため、点呼を開始した後、停止ボタンをクリ...
Ubuntu16.04にCUDA9.0をインストールするための詳細なチュートリアル
序文：この記事は、CUDA 9.0 をインストールした経験に基づいています。CUDA 9.0 は現在...
VMware12 で Ubuntu19.04 デスクトップ版をインストールする (インストール チュートリアル)
1. 実験の説明仮想マシンに、 Ubuntu 19.04オペレーティングシステムを手動でインストー...
SpringBoot のパッケージ化と Docker へのアップロード、およびマルチインスタンス デプロイメントの実装に関する簡単な分析 (IDEA バージョン)
最近友人からDockerを触ったことがあるかと聞かれました。あまり自信がなかったので答えられませんで...
CentOS 7.x dockerはoverlay2ストレージ方式を使用する
/etc/docker/daemon.json を編集し、以下を追加します。 { "ストレ...
MySQL の InnoDB ストレージ ファイルの詳細な説明
物理的に言えば、InnoDB テーブルは、共有テーブルスペース ファイル (ibdata1)、排他テ...
Bash スクリプトでの配列メソッドの作成と使用の概要
Bashで配列を定義するbash スクリプトで新しい配列を作成する方法は 2 つあります。 1 つ目...
ルートパスワードを変更するための MySQL 設定、MySQL サーバー接続、MySQL 共通コマンド図
1. ルートパスワードの設定と変更mysql が起動しているかどうかを確認します。起動していない場合...
Centos に MYSQL8.X をインストールするチュートリアル
MySQLのインストール（4、5、6は省略可能）ステートメント: CentOS のバージョンは 7....
MySQL でパーティション分割後にクエリを実装するために MRG_MyISAM (MERGE) を使用する例
大量のデータベース データを最適化することは非常に高度な科学であり、開発者が習得する必要がある専門的...
Docker ベースの ELK を素早く構築する方法
[概要] この記事では、自作の Docker プラットフォームをベースに完全な ELK システムを素...
テーブルの最大幅と最小幅を設定する際の互換性の問題と解決策の詳細な説明
テーブル内の min-width と max-width プロパティの設定 <テーブル>...
MySQLのロック構造の詳細な説明
Mysqlは3種類のロック構造をサポートしていますテーブルレベルのロック、低オーバーヘッド、高速ロッ...
WeChat アプレット wxs 日付と時刻処理の実装例
目次1. 日付までのタイムスタンプ2. UTCを北京時間に変換するWXS (WeiXin Scrip...