[CSS] font-style, text-style, box모델, background

font-family:가장선호, 2순위, "공백이 있는 폰트이름";

font-style: italic;

font관련 스타일에서
글자의 색은 color
글자의 크기는 font-size
글자체는 font-family
글자의 기울임 설정은 font-style
글자의 볼드체 여부는 font-weight

text-decoration: overline; /* 윗줄 */ 

text-align: right; /* 오른쪽정렬 */

text-decoration: line-through; /* 취소선 */

text-align: center; /* 가운데정렬 */

text-decoration: underline; /* 밑줄 */

text-align: left /* 왼쪽정렬 */

text-transform: uppercase; /* 대문자로 변환 */

letter-spacing: 5px; /* 자간 */

text-transform: lowercase; /* 소문자로 변환 */

line-height: 50pt; /* 줄간격 */

text-transform: capitalize; /* 첫글자 대문자화 */

text-indent: 40pt; /* 들여쓰기 */

font-size: 30px;

text-shadow: 15px 15px 5px red;

box모델에 margin값과 padding이 적용되는 순서

margin : 값1 값2 값3 값4; ==>위, 오른쪽, 아래, 왼쪽

margin : 값1 값2 값3; ==>위, 좌우, 아래

margin : 값1 값2; ==>상하, 좌우

margin : 값1; ==>4방향 모두

인접한 객체들의 margin값은 대체로 교집합 형태로 적용된다.

박스모델(블록요소) 자체를 가운데 정렬하려면 margin의 좌우값을 auto로

margin: 0px auto;

margin-left:auto; margin-right:auto;

border: 5px solid blue;

border-radius:25px; /* 둥근 테두리선 */

text-align: center; /* 가로정렬 */

vertical-align: middle; /* 세로정렬 */

display: table-cell; /* 박스모델의 성질을 변경한다. */

box-shadow:10px 15px 5px gray;

배경(Background)

배경이미지의 상대경로는 내부 css나 inline CSS같은 경우는 html문서를 기준으로 기술

외부css의 경우  css파일이 저장된 위치를 기준으로 경로를 지정하면 된다

-배경이미지의 반복 여부 :

background-repeat속성에 repeat(상하좌우반복, 기본값)

norepeat(반복하지않음)

repeat-x, repeat-y(x축 또는 y축 방향으로만 반복)

-background-position

=> top, center, bottom(상하)

=> left, center, right(좌우)

=> 숫자값

-background-attachment

=> scroll (배경과 내용이 같이 스크롤 된다.)

=> fixed (배경은 스크롤 되지않고 내용만 스크롤 된다.)