HTML DOM Style clear property
Style Objects Definition and Usage
clear property sets or returns the position of the element relative to floating objects.
grammar
Setting clear properties:
Object.style.clear="none|left|right|both|inherit"
Back clear attributes:
Object.style.clear
| 值 | 描述 |
|---|---|
| none | 默认。允许浮动对象出现在元素两侧。 |
| left | 不允许浮动对象出现在元素的左侧。 |
| right | 不允许浮动对象出现在元素的右侧。 |
| both | 不允许浮动对象出现在元素的左侧或右侧。 |
| inherit | clear 属性的值应该从父元素继承。 |
Browser Support
All major browsers are supported by clear property.
Note: IE7 and earlier versions do not support the "inherit" value.IE8 only provides! DOCTYPE supported "inherit". IE9 support "inherit".
Examples
Examples
Do not allow floating objects appear to the left of the text:
<! DOCTYPE html>
<Html>
<Head>
<Meta charset = "utf-8">
<Title> This tutorial (w3big.com) </ title>
<Style type = "text / css">
img {
float: left;
}
</ Style>
<Script>
function displayResult () {
document.getElementById ( "p1") style.clear = "left".;
}
</ Script>
</ Head>
<Body>
<Img src = "w3javascript.gif" width = "100" height = "132">
<P id = "p1"> This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. </ P>
<Input type = "button" onclick = "displayResult ()" value = "text is left floating">
</ Body>
</ Html>
<Html>
<Head>
<Meta charset = "utf-8">
<Title> This tutorial (w3big.com) </ title>
<Style type = "text / css">
img {
float: left;
}
</ Style>
<Script>
function displayResult () {
document.getElementById ( "p1") style.clear = "left".;
}
</ Script>
</ Head>
<Body>
<Img src = "w3javascript.gif" width = "100" height = "132">
<P id = "p1"> This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. </ P>
<Input type = "button" onclick = "displayResult ()" value = "text is left floating">
</ Body>
</ Html>
try it"
Style Objects