디폴트로 지정된 것 위에 인라인 스타일로 덮어씌워 지정된 개체에 최종 작용되는 스타일을 참조한다.
![]() |
Script | [propVal=]parentObj.runtimeStyle.propName; |
HTML | 없다. |
runtimeStyle 개체는 한 개체의 양식과 스타일을 반환하거나 설정한다. 설정하면 현존하는 양식과 스타일을 덮어씌워 반영된다. runtimeStyle 게체가 style 개체에 우선 적용되는 것 이외에는 style 개체와 동등하다.
여러 스타일들을 동시에 변경시키기 위해서는 이 개체를 cssText 속성과 함께 사용하면 된다.
개체 | script | HTML | 규격 | IE |
---|---|---|---|---|
a | [oVal]=a.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
acronym | [oVal]=acronym.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
address | [oVal]=address.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
applet | [oVal]=applet.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
b | [oVal]=b.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
big | [oVal]=big.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
blockQuote | [oVal]=blockQuote.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
body | [oVal]=body.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
br | [oVal]=br.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
button | [oVal]=button.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
caption | [oVal]=caption.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
center | [oVal]=center.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
cite | [oVal]=cite.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
code | [oVal]=code.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
col | [oVal]=col.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
colGroup | [oVal]=colGroup.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
custom | [oVal]=custom.runtimeStyle | 없음 | 없음 | IE5(win32,unix) |
cssText | [oVal]=cssText.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
dd | [oVal]=dd.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
del | [oVal]=del.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
dfn | [oVal]=dfn.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
dir | [oVal]=dir.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
div | [oVal]=div.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
dl | [oVal]=dl.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
dt | [oVal]=dt.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
em | [oVal]=em.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
embed | [oVal]=embed.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
fieldSet | [oVal]=fieldSet.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
font | [oVal]=font.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
form | [oVal]=form.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
frame | [oVal]=frame.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
frameSet | [oVal]=frameSet.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
hn | [oVal]=hn.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
hr | [oVal]=hr.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
html | [oVal]=html.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
i | [oVal]=i.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
iFrame | [oVal]=iFrame.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
img | [oVal]=img.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
button | [oVal]=button.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
checkbox | [oVal]=checkbox.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
FileUpload | [oVal]=FileUpload.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
hidden | [oVal]=hidden.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
img | [oVal]=img.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
password | [oVal]=password.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
radio | [oVal]=radio.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
reset | [oVal]=reset.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
submit | [oVal]=submit.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
text | [oVal]=text.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
ins | [oVal]=ins.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
kbd | [oVal]=kbd.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
label | [oVal]=label.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
legend | [oVal]=legend.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
li | [oVal]=li.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
listing | [oVal]=listing.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
marquee | [oVal]=marquee.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
menu | [oVal]=menu.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
nobr | [oVal]=nobr.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
Object | [oVal]=Object.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
ol | [oVal]=ol.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
Option | [oVal]=Option.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
p | [oVal]=p.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
plainText | [oVal]=plainText.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
pre | [oVal]=pre.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
q | [oVal]=q.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
s | [oVal]=s.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
samp | [oVal]=samp.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
select | [oVal]=select.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
small | [oVal]=small.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
span | [oVal]=span.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
strike | [oVal]=strike.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
strong | [oVal]=strong.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
sub | [oVal]=sub.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
sup | [oVal]=sup.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
table | [oVal]=table.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
tBody | [oVal]=tBody.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
td | [oVal]=td.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
textArea | [oVal]=textArea.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
tFoot | [oVal]=tFoot.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
th | [oVal]=th.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
tHead | [oVal]=tHead.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
tr | [oVal]=tr.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
tt | [oVal]=tt.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
u | [oVal]=u.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
ul | [oVal]=ul.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
var | [oVal]=var.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
xmp | [oVal]=xmp.runtimeStyle | 없음 | 없음 | IE5(win16,win32,unix,mac) |
![]() | runtimeStyle⇒ | ![]() | ⇒ | ![]() ![]() ![]() |
runtimeStyle 설명을 위한 예제
스타일 넣은 곳 |
<div id="divObj" style="text-align:center">스타일 넣은 곳</div><script>oObj=divObj.runtimeStyle;oObj.cssText='border:solid 1 red;color:blue;background-color:pink;font-weight:bold'</script> |
<SCRIPT>document.write(divObj.runtimeStylej.cssText)</SCRIPT> |
클릭하면 색상이 변한다. |
<DIV style="border:dotted 1 blue;cursor:hand" onclick="this.runtimeStyle.cssText='color:red;background-color:blue;border:solid 1 blue;'">클릭하면 색상이 변한다.</DIV> |
![]() | runtimeStyle⇒ | ![]() | ⇒ | ![]() ![]() ![]() |
![]() | runtimeStyle⇒ | ![]() | ⇒ | ![]() ![]() ![]() |
style | script |
---|---|
{accelerator:val} | obj.style.accelerator[=val] |
⇒ 개체가 단축키를 가지고 있는가를 부울값으로 반환하거나 설정한다. | |
{background:val} | obj.style.background[=val] |
⇒ 개체의 배경 속성들을 5개까지 반환하거나 설정한다. | |
{background-attachment:val} | obj.style.backgroundAttachment[=val] |
⇒ 문서 속의 배경 이미지를 개체에 배열 방식을 반환하거나 설정한다. | |
{background-color:val} | obj.style.backgroundColor[=val] |
⇒ 개체의 배경에 깔리는 색상을 반환하거나 설정한다. | |
{background-image:val} | obj.style.backgroundImage[=val] |
⇒ 개체의 배경 이미지를 반환하거나 설정한다 . | |
{background-position:val} | obj.style.backgroundPosition[=val] |
⇒ 개체의 배경 이미지의 위치를 반환하거나 설정한다. | |
{background-position-x:val} | obj.style.backgroundPositionX[=val] |
⇒ backgroundPosition 속성의 x 좌표를 반환하거나 설정한다. | |
{background-position-y:val} | obj.style.backgroundPositionY[=val] |
⇒ backgroundPosition 속성의 y 좌표를 반환하거나 설정한다. | |
{background-repeat:val} | obj.style.backgroundRepeat[=val] |
⇒ 개체 backgroundImage 속성의 반복 방식을 반환하거나 설정한다. | |
{behavior:val} | obj.style.behavior[=val] |
⇒ DHTML behavior의 소개 위치를 반환하거나 설정한다. | |
{border:val} | obj.style.border[=val] |
⇒ 개체의 테두리 속성들을 일괄적으로 반환하거나 설정한다. | |
{border-bottom:val} | obj.style.borderBottom[=val] |
⇒ 개체의 바닥 테두리 속성들을 반환하거나 설정한다. | |
{border-bottom-color:val} | obj.style.borderBottomColor[=val] |
⇒ 개체의 바닥 테두리의 색상을 반환하거나 설정한다. | |
{border-bottom-style:val} | obj.style.borderBottomStyle[=val] |
⇒ 개체의 바닥 테두리 형태를 반환하거나 설정한다. | |
{border-bottom-width:val} | obj.style.borderBottomWidth[=val] |
⇒ 개체의 바닥 테두리의 두께를 반환하거나 설정한다. | |
{border-collapse:val} | obj.style.borderCollapse[=val] |
⇒ 테이블의 줄이나 칸의 테두리가 서로 합해지는가를 분리되는가 나타내는 값을 반환하거나 설정한다. | |
{border-color:val} | obj.style.borderColor[=val] |
⇒ 개체의 테두리 색상들을 반환하거나 설정한다. | |
{border-left:val} | obj.style.borderLeft[=val] |
⇒ 개체 왼쪽 테두리의 속성들을 반환하거나 설정한다. | |
{border-left-color:val} | obj.style.borderLeftColor[=val] |
⇒ 개체 왼쪽 테두리의 색상을 반환하거나 설정한다. | |
{border-left-style:val} | obj.style.borderLeftStyle[=val] |
⇒ 개체 왼쪽 테두리의 형태를 반환하거나 설정한다. | |
{border-left-width:val} | obj.style.borderLeftWidth[=val] |
⇒개체 왼쪽 테두리의 두께를 반환하거나 설정한다. | |
{border-right:val} | obj.style.borderRight[=val] |
⇒ 개체 오른쪽 테두리의 속성들을 반환하거나 설정한다. | |
{border-right-color:val} | obj.style.borderRightColor[=val] |
⇒ 개체 오른쪽 테두리의 색상을 반환하거나 설정한다. | |
{border-right-style:val} | obj.style.borderRightStyle[=val] |
⇒ 개체 오른쪽 테두리의 형태를 반환하거나 설정한다. | |
{border-right-width:val} | obj.style.borderRightWidth[=val] |
⇒ 개체 오른쪽 테두리의 두께를 반환하거나 설정한다. | |
{border-style:val} | obj.style.borderStyle[=val] |
⇒ 개체의 위쪽, 오른쪽, 아래쪽, 왼쪽 테두리들의 형태를 일괄적으로 반환하거나 설정한다. | |
{border-top:val} | obj.style.borderTop[=val] |
⇒ 개체 위쪽 테두리의 속성들을 반환하거나 설정한다. | |
{border-top-color:val} | obj.style.borderTopColor[=val] |
⇒ 개체 위쪽 테두리의 색상을 반환하거나 설정한다. | |
{border-top-style:val} | obj.style.borderTopStyle[=val] |
⇒ 개체 위쪽 테두리의 형태를 반환하거나 설정한다. | |
{border-top-width:val} | obj.style.borderTopWidth[=val] |
⇒ 개체 위쪽 테두리의 두께를 반환하거나 설정한다. | |
{border-width:val} | obj.style.borderWidth[=val] |
⇒ 개체의 위쪽, 오른쪽, 아래쪽, 왼쪽 테두리들의 두께를 일괄적으로 반환하거나 설정한다. | |
{bottom:val} | obj.style.bottom[=val] |
⇒ 개체 체계도상 아래쪽 개체와의 거리를 반환하거나 설정한다. | |
{clear:val} | obj.style.clear[=val] |
⇒ 개체에서 부동(float)부분의 면의 왼쪽, 오른쪽 혹은 양쪽으로 표현이 허용하는가를 반환하거나 설정한다. | |
{clip:val} | obj.style.clip[=val] |
⇒ 개체의 어느 부분을 보이게 할 것인가를 반환하거나 설정한다. | |
{color:val} | obj.style.color[=val] |
⇒ 개체의 글자 색상을 반환하거나 설정한다. | |
없슴 | obj.style.cssText[=val] |
⇒ 스타일 내용(rule)을 반환하거나 설정한다. | |
{cursor:val} | obj.style.cursor[=val] |
⇒ 개체위에서 마우스 포인터의 보이는 형태를 반환하거나 설정한다. | |
{direction:val} | obj.style.direction[=val] |
⇒ 개체의 읽는 순서를 반환하거나 설정한다. | |
{font:val} | obj.style.font[=val] |
⇒ 개체의 font 속성들 조합하여 반환하거나 설정하거나, 사용자 선호 글꼴들을 6개까지 반환하거나 설정한다. | |
{font-family:val} | obj.style.fontFamily[=val] |
⇒ 사용한 글꼴의 이름들을 반환하거나 설정한다. | |
{font-size:val} | obj.style.fontSize[=val] |
⇒ 개체 텍스트에서 사용한 글꼴의 크기를 나타내는 수치를 반환하거나 설정한다. | |
{font-style:val} | obj.style.fontStyle[=val] |
⇒ 개체의 글꼴 형태을 italic, normal, oblique등으로 반환하거나 설정한다. | |
{font-variant:val} | obj.style.fontVariant[=val] |
⇒ 개체의 문자를 작은 대문자들로 변형할 것인가를 반환하거나 설정한다. | |
{font-weight:val} | obj.style.fontWeight[=val] |
⇒ 개체의 글꼴 두께를 반환하거나 설정한다. | |
{height:val} | obj.style.height[=val] |
⇒ 개체의 높이를 반환하거나 설정한다. | |
{ime-mode:val} | obj.style.imeMode[=val] |
⇒ 개체의 입력 방식 편집(IME : Input Method Editor)을 반환하거나 설정한다. | |
{layout-flow:val} | obj.style.layoutFlow[=val] |
⇒ 개체 내용의 방향이나 흐름방향을 반환하거나 설정한다. | |
{layout-grid:val} | obj.style.layoutGrid[=val] |
⇒ 문자들의 레이아웃을 지정하는 문서 그리드(grid) 속성들을 일괄적으로 반환하거나 설정한다. | |
{layout-grid-char:val} | obj.style.layoutGridChar[=val] |
⇒ 엘레멘트듸 내용 문자를 표현하기 위하여 사용된 글자 그리드의 크기를 반환하거나 설정한다. | |
{layout-grid-line:val} | obj.style.layoutGridLine[=val] |
⇒ 엘레멘트듸 내용 문자를 표현하기 위하여 사용된 글자 그리드 줄 값을 반환하거나 설정한다. | |
{layout-grid-mode:val} | obj.style.layoutGridMode[=val] |
⇒ 텍스트 레이아웃 그리드에 가로, 세로가 사용되었는가를 반환하거나 설정한다 | |
{layout-grid-type:val} | obj.style.layoutGridType[=val] |
⇒ 엘레멘트듸 내용 문자를 표현하기 위하여 사용된 그리드의 종류를 반환하거나 설정한다. | |
{left:val} | obj.style.left[=val] |
⇒ 개체 체계도상 왼쪽 개체와의 거리를 반환하거나 설정한다.. | |
{letter-spacing:val} | obj.style.letterSpacing[=val] |
⇒ 개체 속에서 글자들 사이의 간격을 반환하거나 설정한다. | |
{line-break:val} | obj.style.lineBreak[=val] |
⇒ 일본어 텍스트에서 줄자름(line-breaking) 명령(rule)을 반환하거나 설정한다. | |
{line-height:val} | obj.style.lineHeight[=val] |
⇒ 개체 속에서 줄과 아래줄과의 거리를 반환하거나 설정한다. | |
{list-style:val} | obj.style.listStyle[=val] |
⇒ 개체의 목록 스타일(listStyle)을 3개까지 반환하거나 설정한다. | |
{list-style-image:val} | obj.style.listStyleImage[=val] |
⇒ 개체의 목록 스타일(listStyle)에 사용되는 이미지 주소를 반환하거나 설정한다. | |
{list-style-position:val} | obj.style.listStylePosition[=val] |
⇒ 개체의 목록 스타일에 사용되는 항목 표시자의 위치를 개체의 내용에 상대적인 위치로 반환하거나 설정한다. | |
{list-style-type:val} | obj.style.listStyleType[=val] |
⇒ 개체의 목록 스타일에 사용되는 항목 표시자의 정해진 형태를 반환하거나 설정한다. | |
{margin:val} | obj.style.margin[=val] |
⇒ 개체의 위쪽, 오른쪽, 아래쪽, 왼쪽 마진(주변 개체와의 간격)들의 두께를 일괄적으로 반환하거나 설정한다. | |
{margin-bottom:val} | obj.style.marginBottom[=val] |
⇒ 개체의 아래쪽 마진 두께을 반환하거나 설정한다. | |
{margin-left:val} | obj.style.marginLeft[=val] |
⇒ 개체의 왼쪽 마진 두께을 반환하거나 설정한다. | |
{margin-right:val} | obj.style.marginRight[=val] |
⇒ 개체의 오른쪽 마진 두께을 반환하거나 설정한다. | |
{margin-top:val} | obj.style.marginTop[=val] |
⇒ 개체의 위쪽 마진 두께을 반환하거나 설정한다. | |
{min-height:val} | obj.style.minHeight[=val] |
⇒ IE6 개체의 최소 높이를 반환하거나 설정한다. | |
{overflow:val} | obj.style.overflow[=val] |
⇒ 개체의 내용이 높이나 너비를 초과하였을 때 어떻게 처리할 것인가를 나타내는 값을 반환하거나 설정한다. | |
{overflow-x:val} | obj.style.overflowX[=val] |
⇒ 개체의 내용이 너비를 초과하였을 때 그 내용을 어떻게 처리할 것인가를 나타니는 값을 반환하거나 설정한다. | |
{overflow-y:val} | obj.style.overflowY[=val] |
⇒ 개체의 내용이 높이를 초과하였을 때 그 내용을 어떻게 처리할 것인가를 나타니는 값을 반환하거나 설정한다. | |
{padding:val} | obj.style.padding[=val] |
⇒ 개체들 사이, 그들에 소속된 마진, 보더까지의 간격을 반환하거나 설정한다. | |
{padding-bottom:val} | obj.style.paddingBottom[=val] |
⇒ 개체의 아래쪽 보더와 내용 사이의 간격을 반환하거나 설정한다. | |
{padding-left:val} | obj.style.paddingLeft[=val] |
⇒ 개체의 왼쪽 보더와 내용 사이의 간격을 반환하거나 설정한다. | |
{padding-right:val} | obj.style.paddingRight[=val] |
⇒ 개체의 오른쪽 보더와 내용 사이의 간격을 반환하거나 설정한다. | |
{padding-top:val} | obj.style.paddingTop[=val] |
⇒ 개체의 위쪽 보더와 내용 사이의 간격을 반환하거나 설정한다. | |
{page-break-after:val} | obj.style.pageBreakAfter[=val] |
⇒ 개체 다음에 페이지 바꿈할 것인가를 반환하거나 설정한다. | |
{page-break-before:val} | obj.style.pageBreakBefore[=val] |
⇒ 개체 이전에 페이지 바꿈할 것인가를 반환하거나 설정한다. | |
없슴 | obj.style.pixelBottom[=val] |
⇒ 개체의 아래쪽 위치를 픽셀단위로 반환하거나 설정한다. | |
없슴 | obj.style.pixelHeight[=val] |
⇒ 개체의 높이를 픽셀단위로 반환하거나 설정한다. | |
없슴 | obj.style.pixelLeft[=val] |
⇒ 개체의 왼쪽 위치를 픽셀단위로 반환하거나 설정한다. | |
없슴 | obj.style.pixelRight[=val] |
⇒ 개체의 오른쪽 위치를 픽셀단위로 반환하거나 설정한다. | |
없슴 | obj.style.pixelTop[=val] |
⇒ 개체의 위쪽 위치를 픽셀단위로 반환하거나 설정한다. | |
없슴 | obj.style.pixelWidth[=val] |
⇒ 개체의 너비를 픽셀단위로 반환하거나 설정한다. | |
없슴 | obj.style.posBottom[=val] |
⇒ bottom 애트리뷰트로 지정된 단위로 개체의 아래쪽 위치를 반환하거나 설정한다. | |
없슴 | obj.style.posHeight[=val] |
⇒ height 애트리뷰트로 지정된 단위로 개체의 높이를 반환하거나 설정한다. | |
{position:val} | obj.style.position[=val] |
⇒ 개체의 위치시킴 방식을 반환하거나 설정한다. | |
{position:val} | obj.style.position[=val] |
⇒ 개체의 위치시킴 방식을 반환하거나 설정한다. | |
없슴 | obj.style.posLeft[=val] |
⇒ left 애트리뷰트로 지정된 단위로 개체의 왼쪽 위치를 반환하거나 설정한다. | |
없슴 | obj.style.posRight[=val] |
⇒ right 애트리뷰트로 지정된 단위로 개체의 오른쪽 위치를 반환하거나 설정한다. | |
없슴 | obj.style.posTop[=val] |
⇒ top 애트리뷰트로 지정된 단위로 개체의 위쪽 위치를 반환하거나 설정한다. | |
없슴 | obj.style.posWidth[=val] |
⇒ width 애트리뷰트로 지정된 단위로 개체의 너비를 반환하거나 설정한다. | |
{right:val} | obj.style.right[=val] |
⇒ 개체 체계도상 오른쪽 개체와의 거리를 반환하거나 설정한다. | |
{ruby-align:val} | obj.style.rubyAlign[=val] |
⇒ rt 개체에 지정된 루비(ruby) 텍스트의 위치를 반환하거나 설정한다. | |
{ruby-overhang:val} | obj.style.rubyOverhang[=val] |
⇒ rt 개체에 지정된 루비(ruby) 텍스트의 위치를 반환하거나 설정한다. | |
{ruby-position:val} | obj.style.rubyPosition[=val] |
⇒ rt 개체에 지정된 루비(ruby) 텍스트의 위치를 반환하거나 설정한다. | |
{scrollbar-3dlight-color:val} | obj.style.scrollbar3dLightColor[=val] |
⇒ 스크롤 박스와 스크롤바 화살의 위쪽면과 왼쪽면의 색상을 반환하거나 설정한다. | |
{scrollbar-arrow-color:val} | obj.style.scrollbarArrowColor[=val] |
⇒ 스크롤바의 화살의 색상을 반환하거나 설정한다. | |
{scrollbar-base-color:val} | obj.style.scrollbarBaseColor[=val] |
⇒ 스크롤바의 기본 색상(스크롤바, 스크롤 박스, 트랙, 화살)을 반환하거나 설정한다. | |
{scrollbar-darkshadow-color:val} | obj.style.scrollbarDarkShadowColor[=val] |
⇒ 스크롤바의 색상을 반환하거나 설정한다. | |
{scrollbar-face-color:val} | obj.style.scrollbarFaceColor[=val] |
⇒ 스크롤 박스와 스크롤바의 화살의 색상을 반환하거나 설정한다. | |
{scrollbar-highlight-color:val} | obj.style.scrollbarHighlightColor[=val] |
⇒ 스크롤 박스와 스크롤바 화살의 위쪽면과 왼쪽면의 색상을 반환하거나 설정한다. | |
{scrollbar-shadow-color:val} | obj.style.scrollbarShadowColor[=val] |
⇒ 스크롤 박스와 스크롤바 화살의 아래쪽면과 오른쪽면의 색상을 반환하거나 설정한다. | |
{scrollbar-track-color:val} | obj.style.scrollbarTrackColor[=val] |
⇒ 스크롤바 트랙(track) 엘레멘트의 색상을 반환하거나 설정한다. | |
{float:val} | obj.style.styleFloat[=val] |
⇒ 개체에서 어느 방향으로 텍스트가 흐를 것인가를 반환하거나 설정한다. | |
{table-layout:val} | obj.style.tableLayout[=val] |
⇒ 테이블 레이아웃이 고정되어 있는가를 나타내는 문자열을 반환하거나 설정한다. | |
{text-align:val} | obj.style.textAlign[=val] |
⇒ 개체 속의 문자나 개체의 수평 정렬 방식(left, right, center, justified)을 반환하거나 설정한다. | |
{text-align-last:val} | obj.style.textAlignLast[=val] |
⇒ 개체 속의 문자나 개체 마지막 줄의 수평 정렬 방식을 반환하거나 설정한다. | |
{text-autospace:val} | obj.style.textAutospace[=val] |
⇒ 조정된 문자를 위한 자동 문자 간격 맞추기를 반환하거나 설정한다. | |
{text-decoration:val} | obj.style.textDecoration[=val] |
⇒ 개체 속의 문자 장식(깜박거림, 중간줄, 윗줄, 아랫줄)을 반환하거나 설정한다. | |
없슴 | obj.style.textDecorationBlink[=val] |
⇒ 개체의 textDecoration 속성값이 'blink'로 설정되었는가를 부울값으로 반환하거나 설정한다. | |
없슴 | obj.style.textDecorationLineThrough[=val] |
⇒ 개체의 textDecoration 속성값이 'line-through'로 설정되었는가를 부울값으로 반환하거나 설정한다. | |
없슴 | obj.style.textDecorationNone[=val] |
⇒ 개체의 textDecoration 속성값이 'none'로 설정되었는가를 부울값으로 반환하거나 설정한다. | |
없슴 | obj.style.textDecorationOverline[=val] |
⇒ 개체의 textDecoration 속성값이 'overline'로 설정되었는가를 부울값으로 반환하거나 설정한다. | |
없슴 | obj.style.textDecorationUnderline[=val] |
⇒ 개체의 textDecoration 속성값이 'underline'로 설정되었는가를 부울값으로 반환하거나 설정한다. | |
{text-indent:val} | obj.style.textIndent[=val] |
⇒ 개체 속에서 문자의 첫 글자를 들어쓰기 하는 정도를 반환하거나 설정한다. | |
{textjustify:val} | obj.style.textJustify[=val] |
⇒ 개체 속에서 내용의 정렬방식을 반환하거나 설정한다. | |
{text-kashida-space:val} | obj.style.textKashidaSpace[=val] |
⇒ 개체 속에서 문자 정렬 방식을 사용할 때 공백 표시에 kashida 비율을 반환하거나 설정한다. 아랍어에서 사용된다. | |
{text-overflow:val} | obj.style.textOverflow[=val] |
⇒ IE6 개체에서 문자의 넘처흐름을 표시하는 방식값을 반환하거나 설정한다. | |
{text-transform:val} | obj.style.textTransform[=val] |
⇒ 개체 속에서 문자의 변환 표현 방식을 반환하거나 설정한다. | |
{text-underline-position:val} | obj.style.textUnderlinePosition[=val] |
⇒ 개체의 textDecoration 속성이 'underline'로 설정된 경우 밑줄의 위치를 반환하거나 설정한다. | |
{top:val} | obj.style.top[=val] |
⇒ 개체 체계도 상 바로위의 개체로부터의 거리를 반환하거나 설정한다. | |
{unicode-bidi:val} | obj.style.unicodeBidi[=val] |
⇒ 양방향 알고리즘에 관한 깔린 수준을 반환하거나 설정한다. | |
{vertical-align:val} | obj.style.verticalAlign[=val] |
⇒ 개체의 수직 정렬 방식을 반환하거나 설정한다. | |
{visibility:val} | obj.style.visibility[=val] |
⇒ 개체의 내용이 디스플레이될 것인가를반환하거나 설정한다. | |
{width:val} | obj.style.width[=val] |
⇒ 개체의 너비를 반환하거나 설정한다. | |
{word-break:val} | obj.style.wordBreak[=val] |
⇒ 단어 속에서 자동 줄바꿈을 할 것인가를 반환하거나 설정한다. 특히 복수 언어를 사용할 때 중요한다. | |
{word-spacing:val} | obj.style.wordSpacing[=val] |
⇒ 개체 속에서 단어간의 간격을 증가시키는 정도를 반환하거나 설정한다. | |
{word-wrap:val} | obj.style.wordWrap[=val] |
⇒ 내용이 용기 개체의 범위를 초과하면 단어를 자를 것인가를 반환하거나 설정한다. | |
{writing-mode:val} | obj.style.writingMode[=val] |
⇒ 개체속 내용의 방향이나 흐름을 반환하거나 설정한다. | |
{z-index:val} | obj.style.zIndex[=val] |
⇒ 위치가 정해져 있는 개체의 스택킹(위에서 보이는) 순서를 반환하거나 설정한다. | |
{zoom:val} | obj.style.zoom[=val] |
⇒ 개체의 확대 배율을 반환하거나 설정한다. |
![]() | runtimeStyle⇒ | ![]() | ⇒ | ![]() ![]() ![]() |
필터 속성 | 설명 |
---|---|
Alpha | 개체 내용의 명도(opacity)를 조정한다. |
BlendTrans | 개체의 원본 내용을 점진적으로 변화시켜 새로운 내용으로 표현한다. |
Chroma | 개체의 내용 중 지정한 색상을 투명하게 표현한다. |
DropShadow | 개체의 내용을 위로 띄우는 것 처럼되고 그림자가 나타나는 효과를 생성하여 표현한다. |
FlipH | 개체의 내용을 수평으로 뒤집어 표현한다. |
FlipV | 개체의 내용을 수직으로 뒤집어 표현한다. |
Glow | 개체의 내용 주위에 에 지정된 색상과 강도로 반경을 확장하여 표현한다. |
Gray | 개체의 내용을 회색 스케일(grayscale)로 표현한다. |
Invert | 개체 내용 색상의 포화도, 밝기등을 역전 시킨다. |
Light | 개체의 내용에 빛이 비치는 것과 같은 효과를 준다. |
MaskFilter | 개체의 투명한 내용을 색상을 넣어 표시하고, 투명하지 않은 부분은 투명하게 표현한다. |
MotionBlur | 개체의 내용이 달리는 것 같은 상태로 표현된다. |
Redirect | 현재로서는 지원되지 않는 필터 속성이다. |
RevealTrans | 24개의 사전에 정의된 기능에 의하여 개체의 내용을 변환시켜 새로운 내용을 표현한다. |
Shadow | 개체의 내용을 그림자 진 것처럼 변형하여 새로운 내용으로 표현한다. |
Wave | 개체의 내용을 수직 축으로 사인(sine)커브로 파도 효과를 준다. |
Xray | 개체의 내용을 색상을 변경시켜 흑백으로 디스플레이하는 효과를 준다. |
![]() | runtimeStyle⇒ | ![]() | ⇒ | ![]() ![]() ![]() |
메서드 | 설명 |
---|---|
getAttribute | 지정된 애트리뷰트의 값을 반환한다. |
getExpression | 주어진 속성의 표현(expression)을 반환한다. |
removeAttribute | runtimeStyle 개체로 부터 애트리뷰트를 제거한다. |
removeExpression | 지정한 속성으로부터 표현(expression)을 제거한다. |
setAttribute | 지정된 애트리뷰트를 설정한다. |
setExpression | 지정된 개체의 표현(expression)을 설정한다. |
![]() | runtimeStyle⇒ | ![]() | ⇒ | ![]() ![]() ![]() |
runtimeStyle 개체 예제
<INPUT type="button" value="색상 변경" onclick="doChange()"> <DIV id=showA>결과 표시장</DIV> <SCRIPT> var theColor='aqua'; function doChange(){ if (theColor=='aqua') theColor='yellow'; else theColor='aqua' dvObj.runtimeStyle.backgroundColor=theColor; str='dvObj.style.backgroundColor='+dvObj.style.backgroundColor+'<BR>'; str+='dvObj.currentStyle.backgroundColor='+dvObj.currentStyle.backgroundColor+'<BR>'; str+='dvObj.runtimeStyle.backgroundColor='+dvObj.runtimeStyle.backgroundColor; showA.innerHTML=str; } </SCRIPT>
![]() | runtimeStyle | ⇒ | ![]() ![]() |
최종 수정: 05/05/2025 20:31:36 | ![]() All right reserved | 비정상적인 방식으로 프레임없이 페이지에 접속하면 자주 오류가 발생됩니다. 오류가 나면 정상적 접속으로 시도해 보세요. | http://koxo.com/lang/js/object/runtimeStyle.html |