Coding 🖐🏻/html,css
CSS 02 텍스트 꾸미기 속성
김가마
2023. 11. 10. 19:27
텍스트 꾸미기 속성
font-family : 글꼴을 정의한다
font-size: 글자 크기를 정의
text- align : 텍스트 정렬 방식을 정의
color: 글자 색상을 정의
💊font-family : 글꼴을 정의한다
*{ font-family : Time, monospance,serif}
폰트 페밀리: 요소를 구성하는 텍스트의 글꼴을 정의한다. 글꼴명을 속성값으로 지정한다. 여러개의 글꼴을 연달아 기입하여 우선순위를 지정할 수 있다.
💊font-size: 수치와 단위를 지정해 글자의 크기를 정의할 수 있다.
px rem em
px : 모니터 상의 화소 하나 크기의 대응하는 절대적인 크기 | rem :html 태그 폰트 사이즈에 대응하는 상대적인 크기 배수 만큼 크기 조절한다! | em :부모 태그 (상위태그) 의 폰트 사이즈에 대응하는 상대적인 크기 |
span { font-size: 2rem} span{font-size: 1.5em}
예시
header {
font-size: 16px;
}
header-child {
font-size: 4em;
}
-> header-child 4em은 16 *4배 = 64px이다
💊text-align 텍스트 얼라인
블록내에서 텍스트의정렬 방식을 정의한다. 미리 정의된 키워드 값을 지정한다.
left, right center ,justify(양끝 정렬)
💊color 텍스트 색상 정의
키워드, rgb 색상코드(#+16진수값) rgb함수 (red,green,blue)
rgb함수 (red,green,blue 빛의 삼원색을 혼합해 색깔 정의한다)
정리
- font-family :글꼴을 지정하는 속성 ,여러 글꼴을 연달아 기입하여 우선순위를 지정한다
- font-size는 글자 크기는 지정하는 속성이며, px ,rem,em등의 단위를 사용할 수 있다.
- text-align 은 블록 내에서 텍스트의 정렬 방식을 정의한다.
- color: 다양한 방법으로 텍스트의 색상을 정의한다.