圖解clientLeft, clientTop, clientWidth和clientHeight
本文將透過圖解的方式說明CSSOM View Model中Element定義的屬性，包含clientLeft、clientTop、clientWidth和clientHeight。
JavaScript中可以由Element的DOM物件中使用clientLeft、clientTop、clientWidth和clientHeight的屬性，這些屬性的意義可以用下面這張圖說明：
clientWidth
唯讀。表示Element實際上可視的區塊寬度，也可以用數學表示：
clientWidth = width + padding - 卷軸寬度
clientHeight
唯讀。表示Element實際上可視的區塊寬度，也可以用數學表示：
clientHeight = height + padding - 卷軸高度
clientLeft
唯讀。由上圖可知表示可視區左邊界與border左邊界的距離，基本上相當於左邊border的寬度；當左邊有卷軸的時候(書寫方向由右至左時可能會出現)，則還要加上卷軸寬度。用數學表示：
由左至右
clientLeft = borderLeftWidth
由右至左
clientLeft = borderLeftWidth + 卷軸寬度
clientTop
唯讀。由上圖可知表示可視區上邊界與border上邊界的距離，基本上相當於上方border的寬度。用數學表示：
clientTop = borderTopWidth
延伸閱讀
圖解scrollLeft, scrollTop, scrollWidth, scrollHeight和scrollIntoView
