기본 css 요약정리

font

font-family:[폰트이름] (폰트 지정)

font-style:[normal/italic/oblique] (문자의 형태를 지정한다)

font-variant:[normal/small-cap] (소문자를 대문자로 표시)

font-weight:[normal/bold/bolder/lighter/100/200/~900] (문자의 두께를 조절한다)

font-size:[사이즈] (글자의 크기를 지정한다)

color

color:[컬러값] (요소의 텍스트색을 지정한다)

background

background-color:[색값/transparent] (요소의 배경색을 기술)

background-image:[url(주소)/none] (요소의 배경 이미지를 설정)

background-repeat:[repeat/repeat-x/repeat-y/no-repeat] (배경이미지의 반복을 지정)

background-attachment:[scroll/fixed] (배경의 고정과 스크롤을 설정)

background-position:[위치/top/center/bottom/left/right] (배경이미지의 위치를 지정한다)

text

word-spacing:[길이] (단어간 간격설정)

letter-spacing:[길이] (문자간 간격설정)

text-decoration:[none/underline/overline/line-thought/blink] (text에 효과를 준다)

vertical-align:[baseline/sub/super/top/text-top/middle/text-bottom] (세로방향 정렬을 지정한다)

text-transform:[capitalize/uppercase/lowcase/none] (단어를 대소문자로 바꿔줌)

text-align:[left/right/center/justify] (텍스트의 정렬방법을 정한다)

text-indent:[길이] (들여쓰기를 지정한다)

line-height:[길이] (라인과 라인간의 간격을 정한다)

text-justify:[newspaper/distribute-all-lines] (라인폭 자동정렬을 설정)

white-space:[normal/per/nowrap] (공백 처리 방법 설정)

boxmodel (margin, padding, border)

margin-top:[길이] (요소상부의 마진을 설정)

margin-right:[길이] (오른쪽 마진 설정)

margin-bottom:[길이] (하부의 마진 설정)

margin-left:[길이] (왼쪽 마진 설정)

padding-top:[길이] (요소상부의 패딩을 설정)

padding-right:[길이] (오른쪽 패딩을 설정)

padding-bottom:[길이] (하부의 패딩 설정)

padding-left:[길이] (왼쪽 패딩 설정)

border-top-width:[길이] (요소상부의 선두께 설정)

border-right-width:[길이] (요소 오른쪽의 선두께 설정)

border-bottom-width:[길이] (요소 하부의 선두께 설정)

border-left-width:[길이] (요소 왼쪽의 선두께 설정)

border-color:[색갈값] (선색갈을 설정)

border-style:[none/dotted/dashed/solid/double/groove/inset/outset] (선양식을 설정한다)

position

html상의 x,y,z축으로 각 block의 위치를 레이어처럼 겹치고 세밀한 위치를 지정할 수 있다

[absolute][relative]

float

float:[left/rignt/none] (요소의 위치를 기존 자리에서 분리시킨다)

display

display:[block/inline/list-item/none] (브라우저에 디스플레이 되는 방법을 결정)

list

list-style-type:[disk/circle/square/decimal/lower-roman/upper-roman/lower-alpha/upper-alpha/none]

     (리스트 스타일정의)

list-style-image:[url(주소)/none] (list마커로 사용할 이미지 선택)

list-style-position:[outside/inside] (마커가 표시될 위치 지정]

cursor:[hand/move/wait/ne-resize/nw-resize/sw-resize/se-resize] (커서의 형태를 지정)