ホームページ > ウェブフロントエンド > htmlチュートリアル > DIV を操作するための CSS float の使用法

DIV を操作するための CSS float の使用法

php中世界最好的语言
リリース: 2017-11-21 18:05:36
オリジナル
2974 人が閲覧しました

Css スタイルの float 属性は、ラベル オブジェクト (

ラベル ボックス、 ラベル、 ラベル、 ラベル、その他の HTML ラベルなど) のフローティング レイアウトを設定するために使用されます。これは、左にフローティング (float:left) および右にフローティング (float:right) するラベル オブジェクトとも呼ばれます。

フロートとはどういう意味ですか?

floatとは浮くという意味で、中国語に訳すと浮かぶという意味もあります。 float に関する基本情報については、対応する CSS マニュアルの float マニュアルにアクセスしてください。

floatの役割

CSSでfloat(フローティング)を定義し、divスタイルのレイヤーブロックを左右にフロート(リーン)させます。

floatチュートリアルディレクトリ

float構文

floatアプリケーションと使用法

float floatケース

css float他のアプリケーション

css float概要

float構文

Floatの後には属性値が続くことがよくあります。 right, none

Float:none float を使用しないでください

Float:left 左にフロートします

Float:right 右にフロートします

float 構文:

float : none left |right

パラメータ値:

none : オブジェクトは浮動しません

left: オブジェクトが左側に浮動します

right: オブジェクトが右側に浮動します

次に、float の使用方法を div+css の例で説明します。

float のアプリケーションと使用法

Float float は、オブジェクトの左右のフローティング スタイルを設定するために使用され、DIV、SPAN、その他のラベルを左右にフローティングにするために必要なものを実現できます。

簡単な構文

div{float:left} /* css コメント: div オブジェクトを左 (left) にフロートに設定します */

div{float:right} /* css コメント: div オブジェクトを float に設定します右へ (right ) */

css float case

CSS フローティング レイアウトの効果を直感的に確認するために、ボックス内に 2 つのボックスを設定します。1 つは右側に、もう 1 つは左側にフローティングです。 2 つのボックスの特定の幅、高さ、境界線。

1. メインの HTML コード スニペット:

レイアウトは左に移動します
"div _right">レイアウトは右にフロートします

<--html コメント: float を生成するにはフロートをクリアします-->

2. CSS コード スニペット:

.div { width:400px;padding:10px;border:1px Solid #F00}

.div _left{ float:left;width:150px;border: 1px Solid #00F;height:50px}

.div _right{ float:right;width:150px;border:1px Solid #00F;height:50px}

.clear{ clear:both}

CSS 操作 DIV float There使用頻度は限られていますので、必要な友達が保存して、このサイトの他の更新にも引き続き注目してください。

関連書籍:

CSS の最小幅と最大幅を設定する方法

CSS マージンの役割とは何ですか


CSS3 で角を丸くする方法


以上がDIV を操作するための CSS float の使用法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート