Help us test MDN's new front-end:

表示一个元素的左边框的宽度,以像素表示。如果元素的文本方向是从右向左(RTL, right-to-left),并且由于内容溢出导致左边出现了一个垂直滚动条,则该属性包括滚动条的宽度。clientLeft 不包括左外边距和左内边距。clientLeft 是只读的。

从 Gecko 1.9(Firefox 3 bug 111207)开始,基于 Gecko 的应用支持 clientLeft 属性。该属性在 Firefox 2 及更早的版本中不被支持。


var left = element.clientLeft;



Gentle, individualistic and very loyal, Birman cats fall between Siamese and Persian in character. If you admire cats that are non aggressive, that enjoy being with humans and tend to be on the quiet side, you may well find that Birman cats are just the felines for you.

Image:BirmanCat.jpgAll Birmans have colorpointed features, dark coloration of the face, ears, legs and tail.

Cat image and text coming from


LeftTopRightBottommargin-topmargin-bottomborder-topborder-bottom[if IE]><span id="MrgLeft" >margin-left</span><span id="BrdLeft" >border-left</span><span id="PdgLeft" >padding-left</span><span id="PdgRight" >padding-right</span><span id="BrdRight" >border-right</span><span id="MrgRight" >margin-right</span><![endif]


layout.scrollbar.side  preference (译注:这个属性好像是只在火狐浏览器中才有)被设为 1 或 3,且文本方向被设为从右到左(RTL),则垂直滚动条位于左边,这会影响到 clientLeft 属性值的计算。


clientLeft 首次出现于 MS IE DHTML 对象模型中。

元素的文本方向被设为从右到左后,其垂直滚动条的位置取决于 layout.scrollbar.side  preference


Specification Status Comment
CSS Object Model (CSSOM) View Module
Working Draft  

Browser compatibility

Update compatibility data on GitHub
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
clientLeftChrome Full support 43Edge Full support 12Firefox Full support YesIE ? Opera Full support YesSafari Full support 6WebView Android Full support 43Chrome Android Full support 43Edge Mobile ? Firefox Android Full support YesOpera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes


Full support  
Full support
Compatibility unknown  
Compatibility unknown


clientLeft was first introduced in the MS IE DHTML object model.

The position of the vertical scrollbar in right–to–left text direction set on the element will depend on the layout.scrollbar.side preference

When element has display: inline, then clientLeft returns 0 regardless of the element's border.


最后编辑者: mdnwebdocs-bot,