CSSにおけるマージン値と垂直マージンの重なりについて
|
平行ボックスの余白 (二重余白の重なり) に関する面接の質問: 1 つのボックスに上余白があり、もう 1 つのボックスに下余白がある場合、余白の重なりの問題は発生しますか? 解決策: 値の合計ではなく、大きい方の値を取ります。大きい方が優先されます。
<!DOCTYPE html>
<html>
<ヘッド>
<メタ文字セット="utf-8"/>
<タイトル></タイトル>
<スタイル タイプ="text/css">
*{マージン: 0;パディング: 0;}
.box1,.box2{
幅: 200ピクセル;
高さ: 200px;
}
.box1{
背景色: #f90;
下マージン: 20px;
}
.box2{
背景色: 水色;
上マージン: 50px;
}
</スタイル>
</head>
<本文>
<div class="box1"></div>
<div class="box2"></div>
</本文>
</html>
マージンとパディングは、時計回り（上、右、下、左）の方向と値が同じです。「CSS ボックス モデルのパディングと略語」を表示するには、ここをクリックしてください。 CSS におけるマージン値と垂直マージンの重なりについての記事はこれで終わりです。マージンと垂直マージンの重なりについての詳細は、123WORDPRESS.COM の過去の記事を検索するか、以下の関連記事を引き続き閲覧してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。 |
<<: HTML のセルパディングとセルスペース属性を図で説明します
>>: 証明書を使用してリモート Docker サーバーに接続する方法
推薦する
jsは赤い封筒の順序と量を指定するアルゴリズムを実装します
この記事では、指定された赤い封筒の順序と金額を実装するためのjsの具体的なコードを共有します。具体的...
Dockerfile echoは、指定されたファイル内の複数行のテキストを実装する方法を指定します。
Dockerfile内の指定されたファイルに複数の行を追加します。echoの後の「$」記号に注意し...
HTML チュートリアル: 順序なしリスト
<br />原文: http://andymao.com/andy/post/102.h...
Linuxシステムにおけるプロセス管理の詳細な説明
目次1. プロセスとスレッドの概念2. プロセス管理とは何ですか? 3. プロセス管理の役割4. L...
node_modulesを削除して再インストールする方法
目次ステップ1: プロジェクトをインストールするディレクトリにnode_modulesをインストール...
仮想マシンのLinux初心者がIPを設定し、ネットワークを再起動する
仮想マシンを初めて使用する方や、仮想マシンに Linux をインストールしたばかりの方は、システムが...
React Routerの歴史について簡単に説明します
React Router を理解したいなら、まず歴史を理解する必要があります。より具体的には、Rea...
Vue elementUI フォームのネストされたテーブルと各行の検証の詳細な説明
目次エフェクト表示コードリンクキーコード表形式データコンポーネントのネスト検証方法リセット方法完全な...
Centos 6.9 に MySQL をインストールするための詳細なチュートリアル
1. MySQLがインストールされているかどうかを確認します。次のコードで確認できます。 [root...
Mysql の遅いクエリ操作の概要
MySQL の遅いクエリの説明MySQL スロー クエリ ログは、MySQL が提供するログ レコー...
Docker を使用して Microsoft Sql Server を展開するための詳細な手順
目次1 背景2 コンテナを作成する3 SAパスワードを変更する4 mssql のリンク5. コンテナ...
Linux サービス管理の 2 つの方法、service と systemctl の詳細な説明
1.サービスコマンドサービスコマンドは実際には/etc/init.dディレクトリに移動し、関連プログ...
MySQLデュアルマスター（マスターマスター）アーキテクチャ構成ソリューション
企業では、データベースの高可用性は常に最優先事項です。多くの中小企業は、MySQL マスター スレー...
Eclipse/Tomcat でホットデプロイメントとホットスタートを実装する方法
1. ホット デプロイメント: コンテナの実行中にプロジェクト全体を再デプロイすることを意味します。...
Ansible を使用した Nginx のバッチ デプロイのサンプル コード
1.1 nginxインストールパッケージとインストールスクリプトをクライアントにコピーし、スクリプト...