ホームページ >ウェブフロントエンド >jsチュートリアル >html+cssの縦方向中央揃えコンテナ
html+cssの縦方向中央揃えコンテナ
- php中世界最好的语言オリジナル
- 2018-03-12 16:39:221541ブラウズ
今回はhtml+cssの縦方向中央揃えのコンテナについてご紹介します。 html+cssの縦方向中央揃えのコンテナを使用する際の注意点は何ですか?実際の事例を見てみましょう。
<!DOCTYPE html><html lang="en"><head>
<meta charset="UTF-8">
<title>Document</title>
<style>
*{ margin: 0; padding: 0;
} .parent{ width: 400px; height: 400px; border:1px solid gray; position: relative;
} .child{ width: 100px; height: 100px; top:0; left:0; right:0; bottom:0; margin:auto; background: pink; position: absolute;
} </style></head><body>
<div class="parent">
<div class="child"></div>
</div></body></html>この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。 関連記事:
H5のCanvasで音楽リングスペクトログラムを描画する方法
以上がhtml+cssの縦方向中央揃えコンテナの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事：JSで比較演算子を科学的に使用する方法次の記事：JSで比較演算子を科学的に使用する方法