CSSのfloat属性の使い方-フロントエンドQ&A-php.cn

CSSのfloat属性の使い方

藏色散人

リリース： 2019-05-27 17:36:19

オリジナル

2714 人が閲覧しました

css float 属性は、ボックス (要素) をフロートにするかどうかを指定するために使用されます。絶対に配置された要素は float 属性を無視します。

CSSのfloat属性の使い方

#CSS の float 属性を使用するにはどうすればよいですか?

属性の定義と使用方法

float 属性は、ボックス (要素) を浮動させるかどうかを指定します。

注: 絶対に配置された要素は float 属性を無視します。

デフォルト値: none

継承: no

バージョン: CSS1

JavaScript 構文:

object.style.cssFloat="left"

ログイン後にコピー

属性値

left 要素は左に移動します。

right 要素は右に移動します。

none デフォルト値。要素はフロート表示されず、テキスト内のどこにでも表示されます。

inherit は、float 属性の値を親要素から継承することを指定します。

例

画像を右にフローティングさせます:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title></title>
<style>
img 
{
	float:right;
}
</style>
</head>

<body>
<p>在下面的段落中，我们添加了一个 <b>float:right</b> 的图片。导致图片将会浮动在段落的右边。</p>
<p>
<img  src="logocss.gif"    style="max-width:90%"  style="max-width:90%" / alt="CSSのfloat属性の使い方" >
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
这是一些文本。这是一些文本。这是一些文本。
</p>
</body>

</html>

ログイン後にコピー

効果:

CSSのfloat属性の使い方