CSS 기능 정리

[ direction ] 문단에 대한 서식 방향을 설정 합니다.
[ margin ] object의 여백을 설정 합니다. top, right, bottom, left 순서로 여백이 적용 되며 모든 …
[ padding-bottom ] 스타일이 적용된 곳의 하단 경계선으로 부터 안쪽의 내용의 하단 사이에 공간을 …
[ ruby-align ] 문장에 보이는 주석 형식의 RT를 사용 할때 RT안에 정렬 위치를 설정 합니다.
[ border-top-color ] 테두리 상단(top)에 색상을 넣습니다.
[ text-indent ] 문단의 첫 줄이 들여쓰기 됩니다. (값은 들여쓰기 되는 길이)
[ margin-left ] object 또는 문단 경계로 부터 왼쪽 여백을 설정 합니다.
[ padding-right ] 스타일이 적용된 곳의 오른쪽 경계선으로 부터 안쪽의 내용의 오른쪽 사이에 공간…
[ background ] 배경에 대한 세부 설정을 한번에 작업 할 수 있습니다.
[ background-color ] 문서나 object에 배경색을 적용 합니다.
[ layout-grid-mode ] char과 line에 대하여 적용될 객체를 설정 합니다.
[ layout-grid-type ] 텍스트 layout에 대하여 grid될 타입을 설정 합니다.
[ margin-right ] object 또는 문단 경계로 부터 오른쪽 여백을 설정 합니다.
[ padding-top ] 스타일이 적용된 곳의 상단 경계선으로 부터 안쪽의 내용의 상단 사이에 공간을 적…
[ border-left-width ] 테두리(left)의 넓이를 적용 합니다.
[ background-Image ] object에 배경 이미지를 설정 합니다.
[ layout-grid ] layout-grid의 세부 속성들을 한번에 설정 할 수 있으며, 텍스트에 layout을 설정 …
[ padding-left ] 스타일이 적용된 곳의 왼쪽 경계선으로 부터 안쪽의 내용의 왼쪽 사이에 공간을 적…
[ letter-spacing ] 객체의 텍스트간 간격을 설정 합니다. (보통 글자수에 해당하는 "em" 사용)
[ ruby-position ] 문장에 보이는 주석 형식의 RT를 사용 할때 위치를 설정 합니다.
[ font ] font에 관한 모든 속성을 한번에 설정 할 수 있습니다. 또한 시스템 관련 글꼴을 적용 할 …
[ list-style ] 목록 스타일에 관한 모든 설정을 한번에 할 수 있습니다.
[ background-position ] 배경 이미지를 사용 했을때 배경 이미지의 시작점이나 위치를 설정 합니다.
[ layout-grid-char ] layout에 대하여 넓이를 설정 합니다.
[ list-style-type ] 목록 머리표에 기호, 숫자, 로마숫자, 알파벳을 사용 합니다.
[ word-spacing ] 단어간의 간격을 설정 합니다.
[ border-top-style ] 테두리 상단(top)에 스타일을 지정 합니다.
[ list-style-position ] 목록 내에서 줄바꿈 될경우, 다음 줄의 시작점을 설정 합니다.
[ padding ] 스타일이 적용된 안쪽으로 공간을 만듭니다. 안쪽의 다른 객체의 가장 자리로 부터 경계…
[ ime-mode ] 입력 할 수 있는 곳에 대해서 IME를 설정 합니다. (IME 우리는 대부분 대한민국 이겠죠…
[ vertical-align ] 수직 정렬을 설정 합니다.
[ list-style-image ] 목록 머리표에 이미지를 사용 합니다.
[ white-space ] 공백을 그대로 처리하거나 줄바꿈에 대한 설정을 합니다. (PRE, NOBR)
[ border-right-width ] 테두리(right)의 넓이를 적용 합니다.
[ border-bottom-color ] 테두리 하단(bottom)에 색상을 넣습니다.
[ text-overflow ] overflow를 적용한 상태에서 text-overflow를 사용 (텍스트 자체에 위치를 지정 …
[ margin-bottom ] object 또는 문단 경계로 부터 아래쪽 여백을 설정 합니다.
[ border-left ] 테두리에 관한 설정들을 left 부분에 적용 합니다.
[ border-left-style ] 테두리 왼쪽(left)에 스타일을 지정 합니다.
[ border-collapse ] 표(TABLE)에 셀을 주거나 주지 않습니다.
[ border-right-style ] 테두리 오른쪽(right)에 스타일을 지정 합니다.
[ border-left ] 테두리에 관한 설정들을 left 부분에 적용 합니다.
[ border-left-color ] 테두리 왼쪽(left)에 색상을 넣습니다.
[ font-family ] 글꼴체를 설정 합니다. 여러개 사용 가능 하며 구분자(,)를 사용 하며 우선 순위를 …
[ border-right-color ] 테두리 오른쪽(right)에 색상을 넣습니다.
[ font-variant ] 폰트에 대해서 작은 대문자로 적용 됩니다.
[ text-align ] 객체 안에 텍스트의 정렬 상태를 설정 합니다.
[ border-bottom-width ] 테두리(bottom)의 넓이를 적용 합니다.
[ border-top-width ] 테두리(top)의 넓이를 적용 합니다.
[ border-bottom-style ] 테두리 하단(bottom)에 스타일을 지정 합니다.
[ font-size ] 글꼴에 크기를 설정 합니다.
[ border-bottom ] 테두리에 관한 설정들을 bottom 부분에 적용 합니다.
[ color ] 스타일이 적용된 객체내 텍스트에 색상을 설정 합니다.
[ text-decoration ] 텍스트에 밑줄, 윗줄, 가운데 줄, 깜박이 효과등 장식을 합니다.(BLINK 넷츠케…
[ background-repeat ] 배경 이미지의 반복 여부와 방향에 따른 배열을 적용 합니다.
[ border-style ] 테두리의 스타일을 지정 합니다.
[ border-width ] 테두리(top, right, bottom, left)의 넓이를 적용 합니다.
[ text-transform ] 객체 내의 영문자에 대하여 소문자, 대문자, 또는 단어의 첫글자만 대문자로 설…
[ layout-grid-line ] layout에 대하여 높이를 설정 합니다.
[ writing-mode ] 텍스트의 방향을 설정 합니다.
[ border-color ] 테두리에 색상을 넣습니다.
[ font-weight ] 폰트에 대해서 굵기를 적용 합니다.
[ background-attachment ] 배경 이미지를 문서나 object에 사용 했을때 내용이 길어서 스크롤될때 …
[ display ] 스타일을 적용한 객체에 인라인 또는 블럭단위의 박스를 생성 합니다.
[ border ] 객체 주위에 테두리를 만듭니다.
[ border-right ] 테두리에 관한 설정들을 right 부분에 적용 합니다.
[ font-style ] 폰트에 대해서 기울임 효과를 적용 합니다.
[ border-top ] 테두리에 관한 설정들을 top 부분에 적용 합니다.
[ bottom ] Position의 값에 따라서 브라우저나 상위 문단을 기준으로 바닥으로 부터의 위쪽 거리(문…
[ left ] Position의 값에 따라서 브라우저나 상위 문단을 기준으로 왼쪽 에서의 거리(문서내 기준)
[ word-wrap ] 정해진 영역을 내용이 초과시 줄바꿈의 상태를 설정 합니다.
[ right ] Position의 값에 따라서 브라우저나 상위 문단을 기준으로 오른쪽에서의 거리(문서내 기준…
[ overflow ] width 속성이나 height 속성에 의해서 내용에 따라 화면의 크기를 제어 합니다.
[ line-height ] 텍스를 사용 하는데 있어서 줄사이(행간) 간격을 설정 합니다.
[ top ] Position의 값에 따라서 브라우저 또는 상위 문단과 top이 쓰인 객체와의 거리(문서내 기준)
[ height ] 문단이나 이미지의 높이를 설정 합니다.
[ width ] 문단이나 이미지의 너비를 설정 합니다.
[ clip ] object의 일부만 보이게 하고 나머지는 잘라내어 보이지 않습니다.
[ z-index ] Netscape의 <LAYER>와 같은 개념이며, 위치에 따라 중첩된 결과를 보일 수 있고 po…
사용자의 윈도우색상 사용하기
[ position ] 객체의 위치를 화면에 설정 합니다.
[ scrollbar-3dlight-color ] 스크롤바의 스클롤 박스와 화살표 박스의 상단과 왼쪽 가장 자리에 색…
[ overflow-y ] height 속성 의해서 내용에 따라 화면의 높이를 제어 합니다.(세로 Y축 기준: 가로 …
[ :active ] <A> 태그의 링크 상태에 대한 스타일을 적용 합니다. (링크를 클릭 하는 순간)
[ scrollbar-base-color ] 스크롤바의 arrow, shadow, darkshadow를 제외한 기본적인 곳에 적용 됩니…
[ visibility ] 객체를 보이지 않게 할때 사용 합니다.
[ :hover ] 링크걸린 곳에 마우스를 올리는 순간
CSS3 Previews
[ scrollbar-track-color ] 스크롤바의 트랙에 적용 합니다.
[ :visited ] <A> 태그의 링크 상태에 대한 스타일을 적용 합니다. (이미 방문한 곳의 링크)
[ scrollbar-highlight-color ] 스크롤바의 스클롤 박스와 화살표 박스의 상단과 왼쪽 가장 자리의 …
[ table-layout ] 테이블(표)의 테이블 셀(cell), 줄(row), 컬럼(column)들의 배치에 사용되는 기능…
[ :first-line ] 문단 시작 첫 줄에 스타일을 적용 합니다.
[ clear ] float과는 반대 개념의 속성이며 좌측이나, 우측, 또는 양쪽 모두에 다른 문단이 오지 않…
[ scrollbar-darkshadow-color ] 스크롤바의 스클롤 박스와 화살표 박스의 하단과 오른쪽 가장 자리…
[ scrollbar-shadow-color ] 스크롤바의 스클롤 박스와 화살표 박스의 하단과 오른쪽의 그림자 부분…
[ scrollbar-face-color ] 스크롤바의 스클롤 박스와 화살표 박스 그리고 트랙의 표면에만 적용 됩니…
[ scrollbar-arrow-color ] 스크롤바의 화살표 박스의 화살표에 색상을 적용 합니다.
[ page-break-before ] [page-break-after] 인쇄할 페이지 분할
[ min-height ] table-layout에 fixed 되어 있어도 높이만큼 자르지 않고 높이를 설정 할 수 있습니…
[ float ] 보통 이미지에 사용 하는데 이미지 태그 정렬에 관한 속성중 left와 right와 같은 비슷한 …
[ :link ] <A> 태그의 링크 상태에 대한 스타일을 적용 합니다. (가본적이 없는 곳의 링크)
웹표준에 관한 타입 선언
양식과 관련있는 태그 <BUTTON> <FIELDSET> <FORM> <INPUT> <LABLE> &…
[ :first-letter ] 문단 시작 첫 머리글에 스타일을 적용 합니다.
[ overflow-x ] width 속성 의해서 내용에 따라 화면의 너비를 제어 합니다.(가로 X축 기준: 세로 스…
[ cursor ] 마우스 포인터의 모양을 설정 합니다.
[Filter] - 문자나 이미지를 대상으로 색상을 반전시키고 또는 뒤집고,투명하게하고,흐리게
[ zoom ] 객체의 크기를 확대/축소 합니다. (줌 효과)
속성 전체 리스트
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
Previous
Next Post »