[CSS] 주요 속성

CSS 주요 속성

 

width, height

 

width : 요소의 너비 설정

height: 요소의 높이 설정

고정값(px)과 가변값(%)

%는 부모의 영향을 받는다. (상속 받는다.)

---

font

font-size: px, %

font-family 

브라우저마다 지원한 폰트가 다르므로 여러 개를 입력해야 함.

입력한 순서대로 우선순위가 적용된다.

snas-seif: 모든 브라우저에서 적용 가능하기 때문에 맨 마지막에 

속성값(=이 경우에는 폰트 종류)을 넣을 때 모두 넣을 때 쉼표를 넣는다. 

font-style: 이텔릭

font-weight는 굵기(bold)조절시 사용/ 100~900사이의 숫자를 넣을 수 있다.

---

border

 

요소의 테두리의 두께, 색을 설정한다.

border-style: 실선:soild, 점선:dotted

border-width: 두께! px

border-color: 색상;

 

* border: 스타일 두께 색상; - [ 콤마 ] 없음

---

background

 

배경 색상, 이미지 등을 설정한다.

background-color: 배경색상;

background-image: url(이미지 경로); (ex_url(이미지.png))

background-repeat:

기본: repeat(빼곡하게 채움)

1) x축으로 반복(가로로 반복) repeat-x - 가로로만 쭈욱

2) y축으로 반복(세로로 반복) repeat-y - 세로로만 쭈욱

3)반복하지 않음: no-repeat

background-position

공간 안에서 이미지 좌표를 변경할 때 top,bottom,center, left,right등이 있다. 

이걸 조합해서 위치를 표기하면 된다. right top, leift bottom (쉼표 없음)

 

*background: 색상 경로 반복 위치; -[ 콤마 ] 없음