문서 계통도상 다음에 위치한 개체의 왼쪽 모서리에서 해당 개체의 왼쪽 위치까지의 거리를 반환하거나 설정한다.

인수
cssSelector : (스타일 선택자)
속성을 가질수 있는 엘레멘트()나 클라스(class) 이름 혹은 인식자(id)이다.

: (속성 문자열)
스타일 속성은 개체 속에서 글자와 글자 사이의 추가적인 거리를 나타내는 문자열이다.

auto 디폴트이며, 일반적인 HTML 페이지의 레이아웃상 디폴트 위치이다.
(길이) 부동소수점수치 다음에 cm, mm, in, pt, pcpx 등 길이 단위가 따르는 절대 길이, 혹은 em or ex 등의 단위가 따르는 상대 길이이다. CSS 길이단위를 참조하라.
(백분율) 정수값에 백분율 기호(%)를 붙인 것이다. 이 값은 모체 너비에 대한 백분율이다.

이 속성은 currentStyle에서는 읽기전용이고, 그외의 개체에서는 읽기/쓰기이며, 디폴트값은 auto이다.

CSS(Cascading Style Sheets) 애트리뷰트는 상속되지 않는다.

특기

left 애르리뷰트를 사용하기 위해서는 position 애트리뷰트가 설정되어 있어야 하며, 그렇지 않으면 left 애트리뷰트는 무시된다.

left 속성의 값은 문자열이므로, 이 속성값을 스크립트의 개체의 위치 계산에 사용할 수 없다.
대신 pixelLeft 속성이나 posLeft 속성을 사용하여야 한다.

적용
개체scriptCSS IE 버전
참조
pixelTop pixelBottom pixelLeft pixelRight posTop posBottom posLeft posRight
top bottom left right

이 속성은 CSS2(Cascading Style Sheets Level 2)에 정의되었다.


position:relative; 설정과 left 애트리뷰트를 이용하여 이미지 개체의 위치를 조정한다.

<STYLE>.divObj button{width:80}</STYLE>
<DIV style="border:solid 1 red;width:480"><IMG id=imgObj src=../../gif/tulip.gif style="position:relative;left:100"></DIV>
<DIV class=divObj style=white-space:nowrap>
<BUTTON onclick="imgObj.style.left='-30px';">-30px</BUTTON>
<BUTTON onclick="imgObj.style.left='0';">0</BUTTON>
<BUTTON onclick="imgObj.style.left='4cm';">4cm</BUTTON>
<BUTTON onclick="imgObj.style.left='200px';">200px</BUTTON>
<BUTTON onclick="imgObj.style.left='80%';">80%</BUTTON>
<BUTTON onclick="imgObj.style.left='auto';">auto</BUTTON>
</DIV>