[CSS] 웹 폰트

웹 폰트

font-family : “폰트이름”

font-family : arial, “맑은고딕”, sans-serif;

                        ☞ 순서대로 적용됨.

유저 컴퓨터에도 폰트 파일이 설치 되어 있어야 글씨체가 제대로 보인다.

 

폰트 속성

1. font-size : 텍스트의 크기를 지정
2. font-weight : 텍스트의 두께를 지정
3. text-decoration : 테스트의 장식용 선을 추가함 line-through (취소선), overline (윗줄), underline (밑줄)
4. color : 텍스트의 색을 지정
5. line-height : 텍스트의 행간을 설정
6. letter-spacing : 텍스트의 자간을 설정
7. word-spacing : 텍스트의 단어 간 간격을 지정
8. text-align : 블록요소나 표 안에서 텍스트의 가로 정렬 방식을 지정 left, center, right, justify(양측 정렬)
9. vertical-align : 인라인 요소나 표 안에서 텍스트의 세로 정렬 방식을 지정
10. text-indent : 텍스트의 들여쓰기를 지정
11. text-transform : 영문 텍스트의 대/소문자를 바꿀 수 있음 none, capitalize (각 어절의 첫번째 단어를 대문자로 변경), uppercase (대문자로 변경), lowercase (소문자로 변경)
12. word-break : 텍스트가 콘텐츠 박스 영역 밖으로 넘쳤을 때, 어떻게 줄을 변경할 지 지정 keep-all(띄어쓰기를 기준으로 줄바꿈), break-all(어절을 기준으로 줄바꿈)
13. Overflow-wrap : 단어가 콘텐츠 박스 영역 밖으로 넘쳤을 때, 줄바꿈 여부를 설정 normal, break-word
14. Overflow : 콘텐츠가 커서 요소 안에서 내용을 다 보여주기 힘들 때, 어떤 방식으로 보여줄지 설정 visible(기본값), hidden, scroll, auto
15. Text-overflow : 줄바꿈을 하지 않을 때, 요소 밖으로 넘치는 text를 어떻게 표기할 것인지 설정 선행 조건 : white-space : nowrap; , overflow : hidden; clip(기본값), ellipsis