글꼴
font-size : 글자의 크기. 16px(기본값), 단위
font-style ; 글자의 기울기. normal(기울기 없음, 기본값), italic(이텔릭체)
font-weight : 글자의 두께. normal(400,기본값), bold(700), 100~900(수치로 설정)
font-family ; 글꼴(서체) 지정, 여러 개 지정된 것 중 가장 먼저 적용되는 글꼴 사용. san-serif(고딕체 계열, 대부분), monopsace(고정너비 글꼴 계열), cursive(필기체 계열), fantasy(장식 글꼴 계열)
-> 하나씩 써보기
line-height ; 한줄의 높이. 숫자(요소의 글꼴 크기의 배수로 지정), 단위
문자
color ; 글자의 색상. 색상
text-decoration ; 문자의 장식(선). none(기본값), underline(밑줄), line-through(중앙 선)
text-align ; 문자의 정렬 방식. left, right, center
text-indent ; 들여쓰기. 0(기본 값)단위
배경
background-color ; 요소의 배경 색상. transparent(투명함, 기본값), 색상
background-image ; 요소의 배경 이미지 삽입. none(기본값), url("경로")
background-size ; 요소의 배경 이미지 크기. auto(이미지의 실제 크기, 기본값), 단위, cover(비율을 유지, 요소의 더 넓은 너비(가로/세로 中)에 맞춤), contain(비율을 유지, 요소의 더 짧은 너비에 맞춤)
- 숫자 하나만 입력할 경우, 가로의 길이에 해당됨. ex) background-size: 100px -> x=100px
background-repeat ; 요소의 배경 이미지 반복. repeat(이미지를 수직, 수평 반복, 기본값), repeat-x(이미지를 수평 반복), repeat-y(이미지를 수직 바복), no-repeat(반복 x)
background-position ; 요소의 배경 이미지 위치. 방향(top,bottom,left,right,center. 두 개 동시 지정 가능), 단위(x축, y축)
background-attachment ; 요소의 배경 이미지 스크롤 특성. scroll (이미지가 요소를 따라서 같이 스크롤,기본값), fixed(이미지가 뷰포트에 고정 & 스크롤 x)
'WebProgramming > CSS' 카테고리의 다른 글
[SCSS] SCSS란 ? / SCSS 문법 (0) | 2022.06.13 |
---|---|
[CSS] CSS 가이드라인 & 작성 팁 (0) | 2022.05.29 |
[CSS] 전환(transition), 변환(transform)-2차원,3차원 (0) | 2022.05.25 |
[CSS] 배치(position), Flex 박스(flex) + @ (0) | 2022.05.25 |
[CSS] 너비 (width,height,margin,padding,border) + 단위, 색상 (0) | 2022.05.25 |
CSS 의사 클래스(:link,:hover,:checked,:first-child) (0) | 2022.05.06 |
CSS 기본 문법(선택자) + 팁(주석,CSS적용,선택자 우선순위) (0) | 2022.04.25 |