HTML DOM中的樣式cssFloat屬性用於設置或返回元素的水平對齊方式。此屬性允許元素在父實體的右側或左側浮點數,其餘元素環繞在其周圍。
用法:
- 它返回cssFloat屬性。
object.style.cssFloat
- 它用於設置cssFloat屬性。
object.style.cssFloat = "left|right|none|initial|inherit"
屬性值:
- None:它是默認值。此值不會創建浮點數。
- Left:將元素浮點數到父實體/容器的左側。
- Right:將元素浮點數到上級主體/容器的右側。
- Initial:將元素設置為其初始位置。
- Inherit:元素從父元素繼承其浮點數屬性。
範例1:
<!DOCTYPE html>
<html>
<head>
<title>
HTML DOM Style cssFloat Property
</title>
</head>
<body>
<h1 id = "GFG">GeeksForGeeks</h1>
<h2>HTML | DOM cssFloat property</h2>
<button onclick = "RightFloat()">
Float right
</button>
<!-- script to set float of element -->
<script>
function RightFloat() {
document.getElementById("GFG").style.cssFloat
= "right";
}
</script>
</body>
</html>
輸出:
之前單擊按鈕:
單擊按鈕後:
範例2:
<!DOCTYPE html>
<html>
<head>
<title>
HTML DOM Style cssFloat Property
</title>
</head>
<body>
<h1 id = "GFG">GeeksForGeeks</h1>
<h2>HTML | DOM cssFloat property</h2>
<button onclick = "RightFloat()">
Float Right
</button>
<button onclick = "LeftFloat()">
Float Left
</button>
<!-- script to set float of element -->
<script>
function RightFloat() {
document.getElementById("GFG").style.cssFloat
= "right";
}
function LeftFloat() {
document.getElementById("GFG").style.cssFloat
= "left";
}
</script>
</body>
</html>
輸出:
之前單擊按鈕:
單擊左浮點數按鈕後:
單擊浮點數右按鈕後:
支持的瀏覽器:下麵列出了Style cssFloat屬性支持的瀏覽器:
- 穀歌瀏覽器
- IE瀏覽器
- 火狐瀏覽器
- Safari
- Opera
相關用法
- HTML Style top用法及代碼示例
- HTML Style right用法及代碼示例
- HTML Style textAlign用法及代碼示例
- HTML Style borderRight用法及代碼示例
- HTML Style borderLeft用法及代碼示例
- HTML Style wordSpacing用法及代碼示例
- HTML Style textDecorationLine用法及代碼示例
- HTML Style height用法及代碼示例
- HTML Style whiteSpace用法及代碼示例
- HTML Style opacity用法及代碼示例
- HTML Style columnRuleStyle用法及代碼示例
- HTML Style display用法及代碼示例
- HTML Style transformStyle用法及代碼示例
- HTML Style visibility用法及代碼示例
- HTML Style position用法及代碼示例
注:本文由純淨天空篩選整理自ChinkitManchanda大神的英文原創作品 HTML | DOM Style cssFloat Property。非經特殊聲明,原始代碼版權歸原作者所有,本譯文未經允許或授權,請勿轉載或複製。