0 분
0 분
| CSS에서 사용하는 속성들은 선택자에 상관없이 지정해 줌으로써 문서제작을 더욱 편리하고 간편하게 만들어 줍니다. HTML 문서를 구성하는 텍스트(본문, 테이블안의 글자)에 대해서 지정할 수 있는 CSS의 속성들의 사용방법과 기능들을 살펴보도록 하겠습니다.
글자크기에 지정하는 단위로는 pt, px, in, cm, %, xx-small, small, medium, large, x-large, xx-large 등이 있습니다. |
본문(body)에 사용하는 기본 글자의 크기는 9pt로 하고, 표 안(TD)의 글자크기는 x-large로 지정을 합니다. 이렇게 일단 STYLE로 지정을 한 후 본문중에서 본문에서 다시 연습 처럼 지정을 했다면 "연습"이라는 글자는 size=5가 적용이 되고, 나머지는 9pt로 지정이 됩니다.
▶ 글꼴 : font-family
글꼴은 기본적으로 윈도우에 설치되어 있는 기본글꼴만이 적용됩니다. 물론 이것은 사용자의 컴퓨터를 뜻합니다. 이 때문에 자신의 컴퓨터에 아무리 멋진 글꼴이 설치되어 있다고 해도 상대방이 볼 때는 제대로 적용되지 않을 수도 있다는 것입니다. 이런 경우 여러개의 글꼴을 콤마(,)를 사용해서 나열해 주면, 우선순위대로 있는 글꼴을 찾아 표현해 줍니다.
▨ 지정형식▶ 글자 형태 : font-weight/font-style
H1 {font-family:태나무체,궁서체;} HTML 본문중에
태그를 사용한 글자는 "태나무체"로 표시하고, 만약 사용자의 컴퓨터에 "태나무체" 글꼴이 없다면 "궁서체"로 표현하게 됩니다.
HTML로 글자를 굵게 하기 위해서는 태그를 사용해 보았을 것입니다. 이와 마찬가지로 CSS도 글자굵기를 지정할 수 있는데, 여기서는 좀 더 다양하게 normal, bold, bolder, lighter, 숫자(100, 200....)등으로 표현해 줄 수 있습니다.
마찬가지로 글자를 기울일 때는 font-style 속성을 사용해 주며, normal은 일반형태, 기울일 때는 italic 또는 oblique를 사용하면 됩니다.
▨ 지정형식▶ 대문자로 변환 : font-variant
FONT I {font-weight:bolder;} H1 {font-style:italic;} 본문에서 태그와 태그를 사용한 글자는 모두 굵게 표시되며,
태그를 사용한 글자는 기울어지게 됩니다.
이것은 영문자에 적용되는 것으로 문서전체에 사용한 소문자를 대문자로 바꾸고자 할 때 유용하게 사용할 수 있습니다. 대문자로 바꿀 때에는 small-caps를 사용해 주면 됩니다.
▨ 지정형식
H1 {font-variant:small-caps;} 이것은 입력문자가 소문자이어도 대문자로 바꾸어 주는데, 글자크기는 일반대문자보다는 조금 작은 크기입니다.
