CSS 모음

CSS 요소

(선택자) + (이름) { 선언부; }

자주쓰는 CSS 명령어

border : 테두리
padding : 테두리 안의 여백
margin : 테두리 밖의 여백

위의 요소들은 top, left, , right, buttom 4방향 전부 각각 설정 가능하다
(예시 : margin-top: 10px;)

margin: 10px auto : 10px 자동 여백 부여

border-radius : 테두리를 둥글게 바꾼다

text-align : 텍스트 정렬 위치 지정(예시 : center;)

font-family : 폰트 지정
font-size : 폰트 사이즈 정하기
font-weight : 폰트 굵기 정하기

background-color : 백그라운드 색상 정하기

width : 가로
height : 세로
max-width 혹은 max-height : 가로/세로 크기의 최댓값

box-sizing : (border-box 혹은 content-box) 박스의 크기 지정
content-box의 경우, 사용자가 지정한 크기 + 패딩 등등의 값이 더해져 사용자가 지정한 크기보다 박스의 크기가 커짐.
border-box의 경우, 사용자가 지정한 크기의 값 안에서 패딩 등등의 값이 맞춰지게 됨(사용자가 지정한 크기 만큼만 박스를 사용할 수 있음)
보통은 사이즈 지정이 보다 직관적인 border-box를 자주 사용한다.

text-decoration :
none : X
line-throug : 글자 중간에 선을 만든다
overline : 글자 위에 선을 만든다
underline : 글자 아래에 선을 만든다
inherit : 부모 요소의 속성 값을 상속받는다

hover : red;
마우스 커서가 위로 올라갔을 때 색상을 빨간 색으로 바꾼다

box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
박스 그림자 지정(입체감있어보여서 좋다)