Loose-Info.com

Last Update 2019/12/25


TOP - CSS1(Cascading Style Sheets, level 1) - clear

タグのコンテンツとfloatプロパティで指定された要素の位置関係を指定します。
デフォルトはnoneです。

設定値
left
タグのコンテンツを左側に配置、続くコンテンツを右側に配置
right
タグのコンテンツを右側に配置、続くコンテンツを左側に配置
none
floatプロパティによる指定は行わない

(例)
<HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=UTF-8"> <TITLE>テスト</TITLE> <STYLE type="text/css"> <!-- .test1 {float: left} .test2 {float: right} P.test3 {clear: left} P.test4 {clear: right} P.test5 {clear: both} --> </STYLE> </HEAD> <BODY> <P>次のイメージはfloat: left指定</P> <IMG class="test1" src="img_test.jpg"> <P>この段落は通常段落</P> <P class="test4">この段落はclear: right指定</P> <P class="test3">この段落はclear: left指定</P> <HR> <P>次のイメージはfloat: left指定</P> <IMG class="test2" src="img_test.jpg"> <P>この段落は通常段落</P> <P class="test3">この段落はclear: left指定</P> <P class="test4">この段落はclear: right指定</P> <HR> <P>次のイメージはfloat: left指定</P> <IMG class="test1" src="img_test.jpg"> <P class="test5">この段落はclear: both指定</P> <HR> <P>次のイメージはfloat: right指定</P> <IMG class="test2" src="img_test.jpg"> <P class="test5">この段落はclear: both指定</P> </BODY> </HTML>