CSS はフローティング要素を水平方向に中央に配置します_html/css_WEB-ITnose
Jun 24, 2016 am 11:36 AM
固定幅の非浮動要素の場合、margin:0 auto; を使用して水平方向のセンタリングを実行できます。
幅が可変の浮動要素の場合、水平方向のセンタリングの問題を解決する一般的な手法もあります。以下の通り:
HTML コード:
<div class="box"> <p>我是浮动的</p> <p>我也是居中的</p></div>
ログイン後にコピー
CSS コード:
.box{ float:left; position:relative; left:50%;}p{ float:left; position:relative; right:50%;}
ログイン後にコピー
これにより、浮動要素の水平方向の中央揃えの問題が解決されます。
親要素と子要素同時に左に浮動すると、親要素が左に対して 50% 移動し、次に子要素が右に対して 50% 移動、、または子要素が左に対して -50% 移動します。
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

人気の記事
レポ:チームメイトを復活させる方法
3週間前
By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.説明されたエネルギー結晶と彼らが何をするか(黄色のクリスタル)
1週間前
By 尊渡假赌尊渡假赌尊渡假赌
ハローキティアイランドアドベンチャー:巨大な種を手に入れる方法
3週間前
By 尊渡假赌尊渡假赌尊渡假赌
スプリットフィクションを打ち負かすのにどれくらい時間がかかりますか?
3週間前
By DDD

人気の記事
レポ:チームメイトを復活させる方法
3週間前
By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.説明されたエネルギー結晶と彼らが何をするか(黄色のクリスタル)
1週間前
By 尊渡假赌尊渡假赌尊渡假赌
ハローキティアイランドアドベンチャー:巨大な種を手に入れる方法
3週間前
By 尊渡假赌尊渡假赌尊渡假赌
スプリットフィクションを打ち負かすのにどれくらい時間がかかりますか?
3週間前
By DDD

ホットな記事タグ

メモ帳++7.3.1
使いやすく無料のコードエディター

SublimeText3 中国語版
中国語版、とても使いやすい

ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境

ドリームウィーバー CS6
ビジュアル Web 開発ツール

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

ホットトピック
Gmailメールのログイン入り口はどこですか?
7303
9


Java チュートリアル
1622
14


CakePHP チュートリアル
1343
46


Laravel チュートリアル
1259
25


PHP チュートリアル
1207
29



公式アカウントのキャッシュの更新の難しさ:バージョンの更新後のユーザーエクスペリエンスに影響を与える古いキャッシュを回避する方法は?

HTML5フォーム検証属性を使用してユーザー入力を検証するにはどうすればよいですか?

&lt; iframe&gt;の目的は何ですか タグ?使用する際のセキュリティ上の考慮事項は何ですか?
