'팁&테크/HTML & Bootstrap'에 해당되는 글 8건
- 2020.06.26 [Bootstrap] Grid 의 vertical-align
- 2016.02.19 html 코딩 float 로 가로 3등분
- 2014.03.25 [메모]html을 excel로 저장할때 한셀에 여러라인으로 내용 넣을 경우
- 2013.10.15 X-UA-Compatible
- 2011.06.28 CSS 팁 모음
- 2007.06.29 폼에서 urlencode 해서 보내기
- 2007.06.29 스타일 시트
- 2007.06.29 HTML 칼라 코드
[Bootstrap] Grid 의 vertical-align
<!--- vertical-align for row --->
<div class="container">
<div class="row align-items-center">
<div class="col-12 text-center">Content</div>
</div>
</div>
<!--- vertical-align for column --->
<div class="container">
<div class="row">
<div class="col-12 align-self-center text-center">Content</div>
</div>
</div>
<!--- vertical-align for column --->
<div class="container">
<div class="row">
<div class="col-12 my-auto text-center">Content</div>
</div>
</div>
html 코딩 float 로 가로 3등분
가뭄에 콩나듯 html 코딩을 하니 자꾸 까먹어서 남겨둠
float를 사용해서 가로 3등분하는 법
<style type="text/css"> #container{width:100%;*zoom:1;text-align:center;} #container:after {content:" "; display:block; clear:both;} #left{float:left;width:100px;} #right{float:right;width:100px;} #center{margin:0 auto;width:100px;display:inline-block;} </style> <div id="container"> <div id="left"></div> <div id="right"></div> <div id="center"></div> </div>
[메모]html을 excel로 저장할때 한셀에 여러라인으로 내용 넣을 경우
php에서 가끔 내용은 html table로 해서 확장자만 xls로 바꿔서 엑셀 다운로드 하는 경우가 있다.
개인적으로는 비추인 방식이지만 혹시나 해서 메모 해둠
한셀에 여러라인을 넣을려고 할 경우 <td>내용<br>내용</td> 으로 할 경우
두개의 셀로 나누어져 저장된다.
한셀로 저장하려고 할 경우
<style>
br {mso-data-placement:same-cell;}
</style>
br 태그에 속성을 부가하면 한셀에 여러라인으로 표시가 된다.
X-UA-Compatible
마크업에서 호환성 모드 조정
X-UA-Compatible 을 통해 브라우저의 호환성 모드를 조정할 수 있습니다만
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
IE=edge
는 설치된 IE 중 가장 최신 버전을 렌더링에 사용하라chrome=1
는 크롬이 설치되어있다면 IE 에서도 크롬 렌더링을 사용하라
안타깝게도 <!doctype html>
HTML5 DTD 선언시에는 메타태그에 X-UA-Compatible 을 사용하면 w3c validator 에서 HTML5 DTD 는 X-UA-Compatible 속성이 없다는 오류를 냅니다.
그냥 무시하고 사용할 수도 있지만 'ㅅ';
더 좋은 방법으로 서버단에서 X-UA-Compatible 값을 응답 헤더에 포함할 수 있습니다.
서버단에서 설정
Apache 에서 설정
<IfModule mod_setenvif.c>
<IfModule mod_headers.c>
BrowserMatch MSIE ie
Header set X-UA-Compatible "IE=Edge,chrome=1" env=ie
</IfModule>
</IfModule>
<IfModule mod_headers.c>
Header append Vary User-Agent
</IfModule>
Nginx 설정
server {
#...
add_header X-UA-Compatible "IE=Edge,chrome=1";
}
IIS 7.0이상 설정
<configuration>
<system.webServer>
<httpProtocol>
<customHeaders>
<add name="X-UA-Compatible" value="IE=edge,chrome=1" />
</customHeaders>
</httpProtocol>
</system.webServer>
</configuration>
서버단에서 설정을 하게 되면 메타태그로 X-UA-compatible 을 넣지 않아도 됩니다.
CSS 팁 모음
- LI 사이에 공백이 있을 경우(이미지 나열 시 오른쪽에 빈공백)
-> LI의 왼쪽 공백을 -4px를 준다. 예) LI {margin : 0 0 0 -4px;}
상위 UL,OL 에는 반대로 margin : 0 0 0 4px; 를 줘야 왼쪽으로 쏠리지 않음
- float 의 가상 선택자를 이용한 clear
-> FLOAT를사용한오브젝트:after {content:""; display:block; clear:both; }
- object 중앙 정렬
-> 좌우마진을 auto로 하면 중앙에 위치, 반드시 width값이 있어야 함 예) margin : 0 auto;
폼에서 urlencode 해서 보내기
스타일 시트
style script
@charset{rules} 없슴
⇒ 외부 스타일쉬트에 글자세트를 설정한다.
@font-face{rules} 없슴
⇒ HTML 문서에 깔리는 글꼴(font)을 설정한다.
@import{rules} 없슴
⇒ 외부 스타일쉬트를 도입한다.
@media{rules} 없슴
⇒ 메이어 형식을 설정한다.
@page{rules} 없슴
⇒ 인쇄 박스에 크기, 정렬(orientation), 마진들을 설정한다.
:active{rules} 없슴
⇒ a 엘레멘트의 연결이 되거나 활성화 되었을 때의 스타일을 설정한다.
:first-letter{rules} 없슴
⇒ 개체의 첫번째 글자에 적용된다.
:first-line{rules} 없슴
⇒ 개체의 첫번째 줄에 적용된다.
:hover{rules} 없슴
⇒ a 엘레멘트의 연결에 마우스가 올라갔을 때의 스타일을 설정한다.
:link{rules} 없슴
⇒ a 엘레멘트의 연결의 스타일을 설정한다.
:visited{rules} 없슴
⇒ a 엘레멘트의 방문했던 연결의 스타일을 설정한다.
{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]
⇒ 테이블의 줄(row)과 칸(cell)의 태두리(border)의 붕괘 여부를 반환하거나 설정한다.
{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]
⇒ 개체가 왼쪽, 오른쪽 혹은 양쪽으로의 유동하여 다음 텍스트가 유동개체 뒤에 나타나는가를 반환하거나 설정한다.
{clip:val} obj.style.clip[=val]
⇒ 개체의 어느 부분이 보일 것인가를 반환하거나 설정한다.
{clipBottom:val} obj.style.clipBottom[=val]
⇒ 잘라낸 지역의 개체 아래쪽 좌표를 픽셀단위로 반환한다.
{clipLeft:val} obj.style.clipLeft[=val]
⇒ 잘라낸 지역의 개체 왼쪽 좌표를 픽셀단위로 반환한다.
{clipRight:val} obj.style.clipRight[=val]
⇒ 잘라낸 지역의 개체 오른쪽 좌표를 픽셀단위로 반환한다.
{clipTop:val} obj.style.clipTop[=val]
⇒ 잘라낸 지역의 개체 위쪽 좌표를 픽셀단위로 반환한다.
{color:val} obj.style.color[=val]
⇒ 개체의 글자 색상을 반환하거나 설정한다.
{cp--cell-height:val} obj.style.cpCellHeight[=val]
⇒ colorpick 비헤이버의 의하여 디스플레이되는 개별 색상의 높이를 반환하거나 설정한다.
{cp--cell-width:val} obj.style.cpCellWidtht[=val]
⇒ colorpick 비헤이버의 의하여 디스플레이되는 개별 색상의 너비를 반환하거나 설정한다.
{cp--grid-height:val} obj.style.cpGridHeight[=val]
⇒ colorpick 비헤이버의 의하여 디스플레이되는 높이를 반환하거나 설정한다.
{cp--grid-size:val} obj.style.cpGridSize[=val]
⇒ colorpick 비헤이버의 의하여 디스플레이되는 색상의 갯수를 반환하거나 설정한다.
{cp--grid-style:val} obj.style.cpGridStyle[=val]
⇒ colorpick 비헤이버의 개별 색상 주위에 그려지는 속성들의 값을 반환하거나 설정한다.
{cp--grid-width:val} obj.style.cpGridWidth[=val]
⇒ colorpick 비헤이버의 의하여 디스플레이되는 너비를 반환하거나 설정한다.
{cp--hover-style:val} obj.style.cpHoverStyle[=val]
⇒ 마우스 커서가 올라걌을 때 colorpick 비헤이버의 특정 색상에 그려지는 속성들의 값을 반환하거나 설정한다.
{cp--selected-style:val} obj.style.cpSelectedStyle[=val]
⇒ colorpick 비헤이버의 특정 색상을 선택했을 때 그려지는 속성들의 값을 반환하거나 설정한다.
{cssText:val} obj.style.cssText[=val]
⇒ 스타일 명령(rule)을 반환하거나 설정한다.
{cursor:val} obj.style.cursor[=val]
⇒ 개체위에서 마우스 포인터의 보이는 형태를 반환하거나 설정한다.
{direction:val} obj.style.direction[=val]
⇒ 개체의 읽는 순서를 반환하거나 설정한다.
{display:val} obj.style.display[=val]
⇒ 개체를 디스플레이할 것인가를 반환하거나 설정한다.
{filter:val} obj.style.filter[=val]
⇒ 개체에 적용되는 필터들의 컬렉션(filters)을 반환하거나 설정한다.
{float:val} obj.style.float[=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]
⇒ 개체의 글꼴 두께를 반환하거나 설정한다.
없슴 obj.style.hasLayout
⇒ 개체가 레이아웃(layout)을 가지고 있는가를 부울값으로 반환한다.
{height:val} obj.style.height[=sval]
⇒ 개체의 높이를 반환하거나 설정한다.
{imeMode:val} obj.style.imeMode[=val]
⇒ IME(Input Method Editor)의 상태를 반환하거나 설정한다.
{!important} 없슴
⇒ 특정 스타일 명령(rule)의 비중이나 중요성을 증가시킨다.
{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]
⇒ 개체 속에서 목록 스타일을 반환하거나 설정한다.
{list-style-image:val} obj.style.listStyleImage[=val]
⇒ 개체의 라인항목의 불렛으로 표시될 이미지의 주소를 반환하거나 설정한다.
{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]
⇒ 개체의 위쪽 마진 두께을 반환하거나 설정한다.
{minHeight:val} obj.style.min-height[=val]
⇒ 개체의 최소 높이를 반환하거나 설정한다.
{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]
⇒ 개체를 위치시키는 방식을 반환하거나 설정한다.
없슴 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]
⇒ 다음에 위치한 개체의 오른쪽 모서리에서 해당 개체의 오른쪽 위치까지의 거리를 반환하거나 설정한다.
{ro--hover-background:val} obj.style.roHoverBackground[=val]
⇒ rowover 비헤이버가 사용되는 경우 마우스를 테이블 줄에 올렸을 때 배경색상을 반환하거나 설정한다.
{ro--hover-color:val} obj.style.roHoverColor[=val]
⇒ rowover 비헤이버가 사용되는 경우 테이블의 강조(highlight) 텍스트의 색상을 반환하거나 설정한다.
{ro--light-background:val} obj.style.roLightBackground[=val]
⇒ rowover 비헤이버가 사용되는 경우 테이블 줄들의 대체 띄줄의 밝은 색상을 반환하거나 설정한다.
{ro--selected-background:val} obj.style.roSelectedBackground[=val]
⇒ rowover 비헤이버가 사용되는 경우 선택된 테이블 줄의 배경색상을 반환하거나 설정한다.
{ro--shade-color:val} obj.style.roSelectedColor[=val]
⇒ rowover 비헤이버가 사용되는 경우 선택된 테이블 줄의 텍스트 색상을 반환하거나 설정한다.
{ro--shade-background:val} obj.style.roShadeBackground[=val]
⇒ rowover 비헤이버가 사용되는 경우 테이블 줄들의 대체 띄줄의 어두운 색상을 반환하거나 설정한다.
{ruby-align:val} obj.style.rubyAlign[=val]
⇒ rt 개체에 의하여 지정된 루비 텍스트의 위치를 반환하거나 설정한다.
{ruby-overhang:val} obj.style.rubyOverhang[=val]
⇒ rt 개체에 의하여 지정된 루비 텍스트의 위치를 반환하거나 설정한다.
{ruby-position:val} obj.style.rubyPosition[=val]
⇒ rt 개체에 의하여 지정된 루비 텍스트의 위치를 반환하거나 설정한다.
{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) 엘레멘트의 색상을 반환하거나 설정한다.
{style-foat:val} obj.style.styleFloat[=val]
⇒ 개체 속에서 텍스트가 어느쪽으로 유동하는가(흐르는가)를 반환하거나 설정한다.
{table-layout:val} obj.style.tableLayout[=val]
⇒ 테이블 레이아웃이 고정(fixed)되는가를 반환하거나 설정한다.
{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]
⇒ 개체 속에서 문자의 첫 글자를 들어쓰기 하는 정도를 반환하거나 설정한다.
{text-justify: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]
⇒ 문서의 계통도에서 개체의 다음에 위치한 개체의 맨위(top)에 상대적인 위치를 반환하거나 설정한다.
{unicode-bidi:val} obj.style.unicodeBidi[=val]
⇒ 양방향 알고리즘에 관한 깔린 수준을 반환하거나 설정한다.
{verticalAlign:val} obj.style.vertical-align[=val]
⇒ 개체의 수직정렬을 반환하거나 설정한다.
{visibility:val} obj.style.visibility[=val]
⇒ 개체의 내용이 디스플레이될 것인가를 반환하거나 설정한다.
{white-space:val} obj.style.whiteSpace[=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]
⇒ 개체의 확대 배율을 반환하거나 설정한다.
HTML 칼라 코드
|
|