개체가 왼쪽, 오른쪽 혹은 양쪽으로의 유동하여 다음 텍스트가 유동개체 뒤에 디스플레이되는가를 반환하거나 설정한다.

인수
cssSelector : (스타일 선택자)
속성을 가질수 있는 엘레멘트()나 클라스(class) 이름 혹은 인식자(id)이다.

: (속성 문자열)
스타일 속성은 개체가 왼쪽, 오른쪽 혹은 양쪽으로의 유동하여 다음 텍스트가 유동개체 뒤에 디스플레이되는가를 나타내는 문자열이다.

none 디폴트이며, 양쪽 유동개체를 허용한다.
left 개체가 유동개체의 왼쪽 아래로 이동된다.
right 개체가 유동개체의 오른쪽 아래로 이동된다.
both 개체가 유동개체 아래로 이동된다.

이 속성은 currentStyle에서는 읽기전용이고, 그외의 개체에서는 읽기/쓰기이며, 디폴트값은 none이다.

CSS(Cascading Style Sheets) 애트리뷰트는 상속되지 않는다.

적용
개체scriptCSS IE 버전
참조

이 속성은 (영문)DOM1(Document Object Model Level 1)과 CSS1(Cascading Style Sheets, Level 1)에서 정의되었다.


clear 애트리뷰트 예제.
결과 표시창
clear 애트리뷰트 예제.
결과 표시창
<STYLE>button{width:100}</STYLE>
<SCRIPT>
function show1All(){
  str='clear1Obj.style.clear='+clear1Obj.style.clear+'<BR>';
  showA.innerHTML=str;
}
function show2All(){
  str='clear2Obj.style.clear='+clear2Obj.style.clear+'<BR>';
  showB.innerHTML=str;
}
</SCRIPT>
<TABLE width=700 border>
<TR>
<TD colspan=2 style="border:solid 1 blue">
<IMG id="img1Obj" src="../../gif/flower.jpg" width="200" style="float:right">
<SPAN id="clear1Obj" style="clear:none;background:aff">clear 애트리뷰트 예제.</SPAN></TD>
</TR>
<TR>
<TD>
<BUTTON onclick="clear1Obj.style.clear='left';show1All()">clear=left</BUTTON>
<BUTTON onclick="clear1Obj.style.clear='right';show1All()">clear=right</BUTTON>
<BUTTON onclick="clear1Obj.style.clear='both';show1All()">clear=both</BUTTON>
<BUTTON onclick="clear1Obj.style.clear='none';show1All()">clear=none</BUTTON>
</TD>
<TD id=showA>결과 표시창</TD>
</TR>
<TR>
<TD colspan=2 style="border:solid 1 blue">
<IMG id="img2Obj" src="../../gif/flower1.jpg" width="200" style="float:left">
<SPAN id="clear2Obj" style="clear:none;background:aff">clear 애트리뷰트 예제.</SPAN></TD>
</TR>
<TR>
<TD>
<BUTTON onclick="clear2Obj.style.clear='left';show2All()">clear=left</BUTTON>
<BUTTON onclick="clear2Obj.style.clear='right';show2All()">clear=right</BUTTON>
<BUTTON onclick="clear2Obj.style.clear='both';show2All()">clear=both</BUTTON>
<BUTTON onclick="clear2Obj.style.clear='none';show2All()">clear=none</BUTTON>
</TD>
<TD id=showB>결과 표시창</TD>
</TR>
</TABLE>