CSSでフロートの中心を設定するにはどうすればよいですか?
CSSのfloat属性でfloat:rightは右に、float:leftは左に浮動しますが、centered属性が設定されていないので、float属性を中央に配置したい場合はどうすればよいでしょうか。この記事では、CSS で float 属性を中央揃えにする方法を紹介します。
ナビゲーション バーを作成するときにフローティング センタリングをよく使用します。以下では、ナビゲーション バーのフローティング センタリングを使用して、CSS でのフロート センタリングの方法を紹介します。 (関連する推奨事項: css の float 属性を使用する方法?)
CSS で float を中央に配置する方法: Use display:inline-block と float:left
具体的な float センタリングのコード例を見てみましょう:
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8" />
<title></title>
<style type="text/css">
* {
margin:0;
padding:0;
list-style:none;
}
body {
text-align:center;
}
li {
float:left;
font-size:12px;
}
a {
float:left;
border:1px solid #000;
padding:5px 10px;
text-decoration:none;
color:#000;
}
ul {
display:inline-block;
*display:inline;
zoom:1;
}
</style>
</head>
<body>
<ul>
<li><a href="#nogo">首页</a></li>
<li><a href="#nogo">视频</a></li>
<li><a href="#nogo">文章</a></li>
<li><a href="#nogo">登录</a></li>
<li><a href="#nogo">留言</a></li>
</ul>
</body>
</html>float センタリングの効果は次のとおりです:
上記のコードに関しては、*display:inline; が表示されますが、これは実際には CSS ハックの記述方法です (CSS ハックの記述方法を知らない場合は、 、Baidu で自分で検索できます) *{margin: 0;padding: 0;} は過去に一般的な「リセット」スタイルであり、Web ページ内のすべての要素が互いに密接に関連付けられていることを意味するためです。ブラウザによって異なるデフォルトの要素スタイルが生成されるため、 *{ margin: 0; padding: 0;} 主な目的は、さまざまなブラウザのデフォルト スタイルをリセットして、Web ページを表示するさまざまなブラウザの結果が大きく変わらないようにすることです。 。
上記の方法を読んだ後、CSS ハックを使って書くことを思いつかず、互換性も悪い場合があるかもしれません。
そこで、*display を使用しない実装方法を見てみましょう:inline;
CSS で float のセンタリング コード例を設定する方法 (*display:inline; を使用しない):
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8" />
<title></title>
<style type="text/css">
* {
padding: 0px;
margin: 0px;
}
.xlk-nav {
width: 100%;
height: 40px;
text-align: center;
background-color: lightblue;
}
.xlk-menu {
height: 100%;
float: left;
line-height: 40px;
padding: 0 20px;
margin-right: 20px;
background-color: pink;
}
</style>
</head>
<body>
<div class="xlk-nav">
<div style="display: inline-block;">
<div class="xlk-menu">首页</div>
<div class="xlk-menu">视频</div>
<div class="xlk-menu">文章</div>
<div class="xlk-menu">登录</div>
<div class="xlk-menu">留言</div>
</div>
</div>
</body>
</html>センタリングの効果は次のとおりです:
以上がCSSでフロートの中心を設定するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
ホットAIツール
Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ
AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。
Undress AI Tool
脱衣画像を無料で
Clothoff.io
AI衣類リムーバー
AI Hentai Generator
AIヘンタイを無料で生成します。
人気の記事
ホットツール
メモ帳++7.3.1
使いやすく無料のコードエディター
SublimeText3 中国語版
中国語版、とても使いやすい
ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境
ドリームウィーバー CS6
ビジュアル Web 開発ツール
SublimeText3 Mac版
神レベルのコード編集ソフト（SublimeText3）
ホットトピック
float の最大値はいくらですか?
Oct 11, 2023 pm 05:54 PM
float の最大値: 1. C 言語の float の最大値は 3.40282347e+38 IEEE 754 規格によれば、float 型の最大指数は 127、仮数部の桁数は 23 です。このように、最大浮動小数点数は 3.40282347 e+38 になります。 2. Java 言語では、最大浮動小数点数は 3.4028235E+38 です。 3. Python 言語では、最大浮動小数点数は 1.7976931348623157e+308 です。
フロートの精度はどれくらいですか？
Oct 17, 2023 pm 03:13 PM
float の精度は小数点以下 6 ～ 9 桁に達します。 IEEE754 規格によれば、float 型で表現できる有効桁数は約 6 ～ 9 桁です。ただし、これは理論上の最大精度であり、実際の使用では浮動小数点数の丸め誤差により、float 型の精度が低下する場合があります。コンピュータで浮動小数点数演算を実行すると、浮動小数点数の精度制限により精度の低下が発生する場合があります。浮動小数点数の精度を向上させるために、double や long double などのより精度の高いデータ型を使用できます。
C言語でfloatってどういう意味ですか？
Oct 12, 2023 pm 02:30 PM
C 言語の Float は、単精度浮動小数点数を表すために使用されるデータ型です。浮動小数点数は科学的表記法で表現された実数であり、非常に大きな値または非常に小さな値を表すことができます。 float 型の変数は、小数点以下有効数字 6 桁の値を格納できます。C 言語では、float 型を使用して浮動小数点数の演算と格納を行うことができます。その変数は、小数、分数、科学的表記法の表現に使用できます。実数は整数型とは異なり、浮動小数点数は小数点以下の数値を表すことができ、小数に対して四則演算を実行できます。
データベースの浮動小数点の長さはどれくらいですか?
Oct 10, 2023 pm 03:57 PM
一般的なデータベースの float 型の長さは次のとおりです: 1. MySQL の float 型の長さは 4 バイトまたは 8 バイトです; 2. Oracle の float 型の長さは 4 バイトまたは 8 バイトです; 3. SQL Server の float 型の長さ8 バイトに固定されています; 4. PostgreSQL の float 型の長さは 4 バイトまたは 8 バイトなどです。
float32 バイトには何が含まれますか?
Oct 10, 2023 pm 04:07 PM
float32 バイトには、符号ビット、指数ビット、仮数ビットが含まれており、32 ビット浮動小数点数を表すために使用されます。詳細な紹介: 1. 符号ビット (1 ビット)、数値の符号を表すために使用され、0 は正の数値を表し、1 は負の数値を表します; 2. 指数ビット (8 ビット)、数値の指数部分を表すために使用されます。浮動小数点数、指数ビットを介して浮動小数点数のサイズ範囲を調整できます; 3. 仮数ビット (23 ビット) は浮動小数点数の仮数部分を表すために使用され、仮数ビットは格納されます。浮動小数点数の小数部分。符号ビットは浮動小数点数の符号を決定し、指数ビットと仮数ビットは共同して浮動小数点数のサイズと精度を決定します。
float属性の値は何ですか?
Oct 10, 2023 pm 02:03 PM
float 属性値には、left、right、none、inherit、clearinline-start、inline-end が含まれます。詳細な紹介: 1. 左、要素は左側にフロートします。つまり、要素はコンテナの左側にできるだけ近くに配置され、他の要素は右側でそれを囲みます。2. 右、要素右にフロートします。つまり、要素は可能な限りコンテナの近くに配置されます。右側では、他の要素が左側でそれを囲みます。3. デフォルト値の none では、要素はフローティングにならず、配置されます。通常の書類の流れなどに準じて
float と double の違いは何ですか
Oct 11, 2023 pm 05:38 PM
float と double の主な違いは、精度、ストレージと計算速度、範囲、およびプログラミング言語での使用にあります。詳細な紹介: 1. 精度が異なります。Float は 4 バイト (32 ビット) を占有する単精度浮動小数点数ですが、Double は 8 バイト (64 ビット) を占有する倍精度浮動小数点数です。ストレージと計算速度が異なります。double はより多くのスペースを必要とし、値を保存するためにより多くのストレージスペースが必要です。高いパフォーマンスと速度が必要なアプリケーションでは、float 型を使用する方が効率的である可能性があります。3. 範囲が異なるなど。
文字列をfloatに変換する方法
Oct 16, 2023 pm 02:03 PM
Python、JavaScript、Java、C#、Ruby、PHP を介して float に変換できます。詳細な紹介: 1. Python、float_number = float(string_number) と入力します; 2. JavaScript、float_number = parseFloat(string_number); と入力します 3. Java など
