ホームページ > 記事 > ウェブフロントエンド > CSSの左浮動小数点数の書き方は？
CSSの左浮動小数点数の書き方は？
- 青灯夜游オリジナル
- 2019-05-31 13:31:4010100ブラウズ
CSS では、float 属性を使用して要素が浮動する方向を定義できます。左に浮動させたい場合は、float 属性の値を設定するだけです。要素を左に配置します (float:left)。 float 属性についてご紹介しますので、ご参考になれば幸いです。
css float 属性
float 属性は、ボックス (要素) を浮動させるかどうか、およびその方向を指定します。フロート要素は、要素のタイプに関係なく、ブロック レベルのボックスを作成します。
注: 絶対に配置された要素は float 属性を無視します。
構文:
float: left|right|none|inherit;
属性値:
left: 要素は左に移動します。
right: 要素は右にフロートします。
none: デフォルト値。要素はフロート表示されず、テキスト内のどこにでも表示されます。
inherit: float 属性の値を親要素から継承することを指定します。
例: 要素を左にフロートに設定し、水平メニューを作成します
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
ul
{
float:left;
width:100%;
padding:0;
margin:0;
list-style-type:none;
}
a
{
float:left;
width:6em;
text-decoration:none;
color:white;
background-color:purple;
padding:0.2em 0.6em;
border-right:1px solid white;
}
a:hover {background-color:#ff3300;}
li {display:inline;}
</style>
</head>
<body>
<ul>
<li><a href="#">Link one</a></li>
<li><a href="#">Link two</a></li>
<li><a href="#">Link three</a></li>
<li><a href="#">Link four</a></li>
</ul>
</body>
</html>レンダリング:
上の例では、ul 要素と要素を左にフロートさせます。 li 要素はインライン要素として表示され (要素の前後に改行はありません)、リストは強制的に 1 行になります。
ul 要素の幅の 100%、および各ハイパーリンク リストの 6 em (現在のフォント サイズの 6 倍)。また、色や枠線を追加して、より高級感のあるものにしました。
以上がCSSの左浮動小数点数の書き方は？の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事：インラインCSSとは何ですか?次の記事：インラインCSSとは何ですか?