본문 바로가기

프로그래밍 공부/CSS3

CSS3 - 폰트 속성

속성 설명
font-size 글자의 크기를 지정
font-family 글자의 폰트를 설정
font-style 글자의 기울기를 설정
font-weight 글자의 굵기를 지정
line-height 글자의 높이를 지정
text-align 글자를 정렬함
text-decoration a href의 밑줄을 제거

font-size 속성은 글자의 크기를 바꿀 수 있다. 값은 px단위, em단위나 large나 small등의 키워드를 입력해 사용할 수 있다.

 

font-family는 컴퓨터 안에 내장된 글씨 폰트를 적용할 수 있다. 하지만 자신을 제외하고 다른 사용자가 폰트가 없을 수 있기 때문에 보통은 font-family 속성을 여러개 사용한다. 웹 브라우저는 이렇게 지정된 폰트를 사용자의 컴퓨터에서 차례대로 찾아 출력한다. 다국어 웹 페이지는 이러한 문제를 해결하기 위해 마지막 font-family 에는 Serif(명조체), San-serif(고딕체), Mono space(고정폭 글꼴)을 사용한다.

 

font-style은 글씨의 기울기(italic)를 사용할 수 있고, font-weight는 글씨의 굵기를 px단위나 bold등의 키워드로 지정할 수 있다.

font-size, font-family, font-style, font-weight.html
0.00MB

line-height는 글자의 높이를 지정할 수 있다. HTML 페이지에서는 높이를 지정하는 것보다 글자를 수직정렬하는 것에 목적을 둔다.

 

text-align은 글자를 정렬하게 만들어준다. 키워드는 center, left, right 등이 있다.

 

text-decoration은 a태그의 href 속성에서 하이퍼링크 아래의 밑줄을 제거할 수 있다. 색을 바꾸려면 별도로 color 속성을 이용해 바꿔야한다.

line-height, text-align, text-decoration.html
0.00MB

 

'프로그래밍 공부 > CSS3' 카테고리의 다른 글

CSS3 - float 속성  (0) 2019.11.19
CSS3 - 위치 속성  (0) 2019.11.19
CSS3 - 배경 속성  (0) 2019.11.18
CSS3 - 테두리 속성  (0) 2019.11.18
CSS3 - 박스 속성  (0) 2019.11.17