Style width 속성

정의와 사용법

width 속성을 사용하여 설정하거나 반환합니다。

width 속성은 블록 요소나 절대 또는 고정 위치를 가진 요소에만 유효합니다. 초과된 내용은 overflow 속성 처리하십시오

추천사용하십시오 height 속성 요소의 높이를 설정하거나 반환합니다。

추가로 참조하십시오：

CSS 가이드CSS Dimension

CSS 가이드CSS 프레임 모델

CSS 참조 가이드width 속성

예제

예제 1

<button> 요소의 너비 설정：

document.getElementById("myBtn").style.width = "300px";

직접 시험해 보세요

예제 2

<div> 요소의 너비 변경：

document.getElementById("myDIV").style.width = "500px";

직접 시험해 보세요

예제 3

<img> 요소의 높이와 너비 변경：

document.getElementById("myImg").style.height = "300px";
document.getElementById("myImg").style.width = "300px";

직접 시험해 보세요

예제 4

<img> 요소의 너비 반환：

alert(document.getElementById("myImg").style.width);

직접 시험해 보세요

문법

width 속성 반환：

object.style.width

width 속성 설정：

object.style.width = "auto|length|%|initial|inherit"

속성 값

값 설명
auto 브라우저가 너비를 설정합니다. 기본 값。
length 너비를 길이 단위로 정의합니다。
% 부모 요소의 너비를 백분율로 정의합니다。
initial 이 속성을 기본 값으로 설정합니다. 참조하십시오 initial。
inherit 부모 요소에서 이 속성을 상속받습니다. 참조하십시오 inherit。

기술 세부 사항

기본 값： auto
반환 값： 문자열로, 요소의 너비를 나타냅니다。
CSS 버전： CSS1

브라우저 지원

크롬 에지 파이어폭스 사파리 오페라
크롬 에지 파이어폭스 사파리 오페라
지원 지원 지원 지원 지원