본문 바로가기

강의실/css

font-family

Font-family
스타일시트의 요소(element)로써 글자체를 font-family에서 지정할수 있습니다. 즉 원하는 글자체로 글자를 보여줄 수 있다는 것이지요. 하지만 여기서 주의해야 할점은 내가 원하는 글자체로 지정을 해도 방문객의 폰트디렉토리에 이런 폰트가 없으면 무용지물이 되어 버린다는 것입니다.

내 컴에는 수많은 폰트들이 들어 있어서 폰트패밀리에 지정한 글자체로 보여질지라도 방문객의 컴퓨터에는 어떤 폰트가 있는지 알수가 없으므로 폰트패밀리의 사용은 그만큼 제약을 받게됩니다.

따라서 이 요소를 사용할시에는 너무 멋진 폰트만 찾지 말고 공통적으로 윈도우를 인스톨 시키면 들어 있는 폰트의 범위내에서 사용해야 하겠습니다. 억지로 어떤 폰트를 사용하고 싶다면 방문객에게 폰트를 제공하고 설치후 다시 방문하라는 방식으로도 적용이 가능하겠지만^^ ...

다음은 글자 크기는 20pt 이고 글자색은 빨간색을 적용시킨 몇가지 폰트패밀리의 예입니다. 지정한 글자체로 보이지 않을 경우 당신의 컴퓨터에는 이런 폰트가 없으므로 지원되지 않는 경우입니다.

<H1 STYLE="font-family:Arial">폰트패밀리 Arial</H1>

폰트패밀리 Arial


<H1 STYLE="font-family:Time New Roman">폰트패밀리 Time New Roman</H1>

폰트패밀리 Time New Roman


<H1 STYLE="font-family:serif">폰트패밀리 serif</H1>

폰트패밀리 serif


<H1 STYLE="font-family:휴먼옛체">폰트패밀리 휴먼옛체</H1>

폰트패밀리 휴먼옛체


<H1 STYLE="font-family:송성훈신샘체">폰트패밀리 송성훈신샘체</H1>

폰트패밀리 송성훈신샘체



위에서도 언급하였지만 여기서 지정하는 폰트는 반드시 접속한 컴퓨터에 이런 폰트가 있어야 합니다. 그럼 없을 경우에는 어떻게 보이는걸까? 그냥 디폴트로 보입니다. 즉 적용하지 않았을 경우에 해당이 되는것입니다.

그래서 폰트를 지정할때 하나만 지정하는것이 아니라 지정한 폰트가 없을경우를 대비해서 여러개의 폰트를 지정합니다. 여러개의 폰트를 지정하면 제일 처음에 지정한 폰트를 찾아 적용시키고 만약 없을 경우에는 두번째 지정한 폰트를 찾아 적용시키게 됩니다.

다음은 여러개의 폰트를 지정하는 방법입니다. 우선순위는 처음에 써준거부터 적용됩니다.

<H1 STYLE="font-family:Arial,serif,휴먼옛체,송성훈신샘체">폰트패밀리 Arial</H1>


위의 소스를 보시면 이해가 되지요? 그럼 이렇게 적용시킬수 있는 폰트는 무엇무엇이 있을까요? 폰트는 너무나 많이 지원이 되기 때문에 일일이 기입하는것은 거의 불가능합니다. 따라서 자신의 컴에 어떤 폰트가 있는지를 확인하고 그것을 하나 하나 적용시켜 보면 궁금증을 해결 할 수 있을겁니다.

내 컴에 폰트는 어디에 있나? - 윈도우폴더의 폰트폴더가 있습니다. 그곳에 가면 다음 그림과 같이 여러가지 폰트가 있습니다.

 

'강의실 > css' 카테고리의 다른 글

font-style  (0) 2007.07.25
font-size  (0) 2007.07.25
css 사용법 2  (0) 2007.07.25
css 사용방법 1  (0) 2007.07.25
css란 무엇인가?  (0) 2007.07.25