CSS 속성

FONT(글꼴)
CSS	Script	내 용
font	font	글꼴에 관련된 속성을 설정
font-family	fontFamily	글꼴이름을 설정
font-size	fontSize	글자 크기를 설정
font-style	fontStyle	글자의 형태를 설정
font-variant	fontVariant	글자의 대/소문자 설정
font-weight	fontWeight	글자의 두께 설정

    TEXT(글자)

CSS	Script	내 용
color	color	글자 색 설정
direction	direction	글자를 표시하는 방향 설정
letter-spacing	letterSpacing	글자 사이의 간격 설정
text-align	textAlign	글자의 정렬 설정
text-decoration	textDecoration	글자의 꾸밈 및 형식 설정
text-indent	textIndent	문단의 첫 줄 들여쓰기 설정
text-transform	textTransform	대.소문자 변환 여부 설정
line-height	lineHeight	줄 간격 설정
text-underline-position	textUnderlinePosition	밑줄이 그어지는 위치 지정
word-spacing	wordSpacing	단어 사이의 간격 설정
ime-mode	imeMode	입력모드 IME(한/영) 설정

BACKGROUND(배경)

CSS	Script	내 용
background	background	웹문서의 배경을 정의하며 각각의 속성값을 "," 없이 두 개 이상 설정 가능
background-attachment	backgroundAttachment	배경그림을 고정 또는 스크롤 설정
background-color	backgroundColor	배경색 설정
background-image	backgroundImage	배경그림 설정
background-position	backgroundPosition	배경그림 위치 설정
background-repeat	backgroundRepeat	배경그림 반복 여부 설정

BORDER(테두리)

CSS	Script	내 용
border	border	테두리의 너비, 형식, 색을 설정 두 개이상 설정 가능
border-top	borderTop	위쪽 테두리의 너비, 형식, 색등을 설정
border-bottom	borderBottom	아래 테두리의 너비, 형식, 색등을 설정
border-left	borderLeft	왼쪽 테두리의 너비, 형식, 색등을 설정
border-right	borderRight	오른쪽 테두리의 너비, 형식, 색등을 설정
border-color	borderColor	테두리의 색을 설정
border-top-color	borderTopColor	위쪽 테두리의 색을 설정
border-bottom-color	borderBottomColor	아래 테두리의 색을 설정
border-left-color	borderLeftColor	왼쪽 테두리의 색을 설정
border-right-color	borderRightColor	오른쪽 테두리의 색을 설정
border-style	borderStyle	테두리 형식 설정
border-top-style	borderTopStyle	위쪽 테두리 형식 설정
border-bottom-style	borderBottomStyle	아래 테두리 형식 설정
border-left-style	borderLeftStyle	왼쪽 테두리 형식 설정
border-right-style	borderRightStyle	오른쪽 테두리 형식 설정
border-width	borderWidth	테두리 두께 설정
border-top-width	borderTopWidth	위쪽 테두리 두께 설정
border-bottom-width	borderBottomWidth	아래 테두리 두께 설정
border-left-width	borderLeftWidth	왼쪽 테두리 두께 설정
border-right-width	borderRightWidth	오른쪽 테두리 두께 설정

MARGIN(여백)

CSS	Script	내 용
margin	margin	여백의 속성을 설정
margin-top	marginTop	위쪽 여백 설정
margin-bottom	marginBottom	아래 여백 설정
margin-left	marginLeft	왼쪽 여백 설정
margin-right	marginRight	오른쪽 여백 설정

PADDING(테두리와 내용과의간격 = 안쪽여백을 뜻함)

CSS	Script	내 용
padding	padding	테두리와 글자 사이 간격 설정
padding-top	paddingTop	위쪽 테두리와 글자 사이 간격 설정
padding-bottom	paddingBottom	아래 테두리와 글자 사이 간격 설정
padding-left	paddingLeft	왼쪽 테두리와 글자 사이 간격 설정
padding-right	paddingRight	오른쪽 테두리와 글자 사이 간격 설정

LIST(목록)

CSS	Script	내 용
display	display	객체에 인라인 또는 블럭단위의 박스를 생성
list-style	listStyle	목록의 형식,위치,그림의 속성을 설정
list-style-image	listStyleImage	목록의 표시를 그림으로 설정
list-style-position	listStylePosition	목록 항목의 위치를 설정
list-style-type	listStyleType	목록의 항목 표시자의 속성을 설정

POSITION(위치)

CSS	Script	내 용
height	height	영역의 높이를 설정
width	width	영역의 너비를 설정
top	top	상단 테두리에서 떨어진 간격 설정
bottom	bottom	하단 테두리에서 떨어진 간격 설정
left	left	상단 테두리을 기준으로 왼쪽 간격을 설정
right	right	상단 테두리을 기준으로 오른쪽 간격을 설정
clip	clip	4각형 Block Box를 지정하는 수치만큼 가려서 안 보이도록 설정
overflow	overflow	width 속성이나 height 속성에 의해서 내용에 따라 화면의 크기를 제어
position	position	화면에 표시할 위치를 설정
visibility	visibility	화면에 표시 여부를 설정
z-index	zIndex	Netscape의<layer>와 같은 개념</layer>

CLASSIFICATION(식별)

CSS	Script	내 용
cursor	cursor	커서의 모양을 설정
float	float	상위 요소안에서 좌.우로 이동할 것인가를 설정
clear	clear	상위 요소안에서 좌.우로 이동하지 않고 줄바꿈 설정
zoom	zoom	객체의 크기를 확대/축소
link	link	링크 설정 : 링크관련 가상 클래스(link,visited,active,hover)

TABLE(표)

CSS	Script	내 용
border-collapse	borderCollapse	표(TABLE)에 셀간격 설정
table-layout	tableLayout	테이블(표)의 테이블 셀(cell), 줄(row), 컬럼(column)들의 배치에 사용되는 기능

Printing (프린트)

CSS	Script	내 용
page-break-after	pageBreakAfter	프린터로 출력할 때 다음 페이지로 페이지를 넘기는 것을 지정
page-break-before	pageBreakBefore	프린터로 출력할 때 다음 페이지로 페이지를 넘기는 것을 지정

SCROLLBAR COLOR(스크롤바 색상)

CSS	내 용
scrollbar-3dlight-color	스크롤바의 스클롤 박스와 화살표 박스의 상단과 왼쪽 가장 자리에 색상 설정
scrollbar-arrow-color	스크롤바의 화살표 박스의 화살표에 색상을 설정
scrollbar-base-color	스크롤바의 arrow, shadow, darkshadow를 제외한 기본적인 곳에 설정
scrollbar-darkshadow-color	스크롤바의 스클롤 박스와 화살표 박스의 하단과 오른쪽 가장 자리에 색상 설정
scrollbar-face-color	스크롤바의 스클롤 박스와 화살표 박스 그리고 트랙의 표면 설정
scrollbar-highlight-color	스크롤바의 스클롤 박스와 화살표 박스의 상단과 왼쪽 가장 자리의 하이라이트 부분과 트랙 설정
scrollbar-shadow-color	스크롤바의 스클롤 박스와 화살표 박스의 하단과 오른쪽의 그림자 부분 설정
scrollbar-track-color	스크롤바의 트랙에 설정

FILTER(필터)

CSS	Script	내 용
Alpha	Alpha	그림이나 글자에 투명도를 조정할 수 있는 명령어
Blur	Blur	흐리게 하는 효과
Chroma	Chroma	지정된 특정색을 투명하게 하는 효과
Dropshadow	Dropshadow	특정위치에 그림자를 만들어 줍니다
FlipH	FlipH	이미지나 좌우가 바뀝니다.
FlipV	FlipV	이미지나 상하가 바뀝니다.
Glow	Glow	글자나 이미지에 지정된 색을 번지게 하는 효과를 나타냅니다
Gray	Gray	흑백 이미지를 만듭니다.
Invert	Invert	색조, 순도, 명도(필름 효과)를 반전
Light	Light	조명 효과를 주어 이미지의 특정 부분을 밝게 해줍니다.
Mask	Mask	불투명한 것은 투명한 마스크를 씌우고 투명한 것은 지정된 색으로 마스크를 씌워 줍니다.
Shadow	Shadow	지정하는 색상과 방향으로 그림자를 만들어 줍니다.
Wave	Wave	물결 형태의 웨이브를 만들어 주는 필터입니다.
Xray	Xray	X-ray 사진 같은 효과를 나타내 주는 필터입니다

Display(표현방식)

block : 블록박스로 만든다.
inline : 인라인 박스로 만든다.
inline-block : 블록박스로 만들어지지만, 인라인 박스처럼 배치된다. (CSS2.1 권고후보에 추가)
none : 박스를 만들지 않으며 시각적으로 완전히 보이지 않는다.
inherit : 상위 요소의 display속성을 상속받는다.

table : 블록레벨의 표로 만든다. (table)
inline-table : 인라인레벨의 표로 만든다. (table)
table-row : 행으로 만든다 (tr 기본 속성)
table-row-group : 본체 행 그룹으로 만든다. (tbody 기본 속성)
table-header-group : 헤더 행 그룹으로 만든다. (thead 기본 속성)
table-footer-group : 푸터 행 그룹으로 만든다. (tfoot 기본 속성)
table-column : 열로 만든다. (col 기본 속성 - 보이지 않음)
table-column-group : 열 그룹으로 만든다. (colgroup 기본 속성 - 보이지 않음)
table-cell : 하나의 셀로 만든다. (td 기본 속성)
table-caption : 캡션으로 만든다. (caption 기본 속성)

list-item : li요소와 같은 블록박스와 목록항목의 인라인박스로 만든다.
run-in : 런인박스로 만든다.
compact : 콤팩트 박스로 만든다. (CSS2.1권고후보에서 삭제)
marker : 그 요소의 전후에 생성된 내용을 마커로 정의한다. (CSS2.1권고후보에서 삭제)