HTML DOM Style left property
Style Objects Definition and Usage
left property sets or returns the position of the positioning element in the left section.
This attribute specifies the position of the left portion of elements, including: padding, scroll bars, borders, and margins.
Tip: a positioning element is the element's position attribute is set: relative (relative), absolute (absolute) or fixed (fixed).
grammar
Setting left properties:
Object.style.left="auto|length|%|inherit"
Back left properties:
Object.style.left
| 值 | 描述 |
|---|---|
| auto | 默认。通过浏览器计算左部的位置。 |
| length | 使用 px、cm 等单位定义元素的左边到最近一个具有定位设置父元素的左部边缘的位置。可使用负值。 |
| % | 定义元素的左边到最近一个具有定位设置父元素的左部边缘的百分比位置。 |
| inherit | left 属性的值从父元素继承。 |
Browser Support
All major browsers support left property.
Note: IE7 and earlier versions do not support the "inherit" value.IE8 only provides! DOCTYPE supported "inherit". IE9 support "inherit".
Examples
Examples
Settings button in the left portion of the position:
<html>
<head>
<style type="text/css">
#b1
{
position:absolute;
}
</style>
<script>
function displayResult()
{
document.getElementById("b1").style.left="100px";
}
</script>
</head>
<body>
<input type="button" id="b1" onclick="displayResult()" value="Set left position to 100 px">
</body>
</html>
<head>
<style type="text/css">
#b1
{
position:absolute;
}
</style>
<script>
function displayResult()
{
document.getElementById("b1").style.left="100px";
}
</script>
</head>
<body>
<input type="button" id="b1" onclick="displayResult()" value="Set left position to 100 px">
</body>
</html>
try it"
Style Objects