글꼴

웹 입력 체계는 Internet Explorer 10 및 JavaScript를 사용하는 Windows 스토어 앱의 OpenType 레이아웃 기능에 대한 하위 수준 제어 지원을 크게 향상시켰습니다. W3C(World Wide Web 컨소시엄) CSS 글꼴 모듈 수준 3 사양섹션 6.12에 정의된 font-feature-settings 속성을 사용하면 Microsoft OpenType 레이아웃 기능을 포함하는 글꼴의 문자 모양 대체 및 위치를 지정할 수 있습니다.

이 항목의 내용은 다음과 같습니다.

입력 체계 기능

OpenType 사양은 글꼴 디자이너가 구현할 수 있는 많은 고급 입력 체계 기능을 정의합니다. 예를 들어 글꼴의 세로 위치를 정의하고, 문자 모양 양식을 합자, 컨텍스트 대체, 스타일 대체 또는 선단 장식으로 바꾸고, 소문자를 포함할 수도 있습니다.

각 정의된 기능에는 기능과 효과를 식별하는 해당 기능 태그가 있습니다. 글꼴 개발자가 기능을 직접 정의할 수도 있습니다. Internet Explorer 10 및 JavaScript를 사용하는 Windows 스토어 앱에서는 기능 태그를 조사하여 해당 기능이 수행하는 작업과 태그를 구현할지 여부를 결정합니다. 다음 표에서는 일반적인 기능 태그와 해당 정의를 보여 줍니다. OpenType 레이아웃 기능의 전체 목록은 OpenType 레이아웃 기능 태그 레지스트리(영문)를 참조하세요.

태그설명

kern

커닝

smcp

작은 대문자

liga

표준 합자

dlig

임의 합자

ss01, ss02, ss03 ... ss20

스타일 집합(글꼴별)

swsh

선단 장식

tnum

표 형식 그림

lnum

라이닝 그림

onum

이전 스타일 그림

 

참고  이 표에 나열된 글꼴 기능을 잘 모르겠으면 CSS 글꼴 모듈 수준 3 사양의 섹션 6, "글꼴 기능 속성"(영문)에서 각 기능의 자세한 설명과 시각적 예제를 참조하세요. 나열된 속성은 Internet Explorer 10 및 JavaScript를 사용하는 Windows 스토어 앱에서 지원될 수 있는 OpenType 레이아웃 기능에 해당하지만 속성 자체(font-kerning, font-variant-* 등)는 지원되지 않습니다.

OpenType 레이아웃 기능 구현

OpenType 레이아웃 기능을 사용하려면 먼저 하나 이상의 기능이 포함된 글꼴을 사용해야 합니다. 글꼴 연결, 지원되는 글꼴 형식 등 고급 서체 디자인 사용에 대한 자세한 내용은 CSS3으로 웹 사이트의 서체 디자인을 향상하는 방법을 참조하세요.

OpenType 레이아웃 기능이 기본 제공된 글꼴을 사용하여 글꼴 연결을 설정한 후 font-feature-settings 속성을 통해 이러한 기능을 구현합니다. Internet Explorer 10 및 JavaScript를 사용하는 Windows 스토어 앱에서 이 속성의 구문은 다음과 같습니다. 여기서 "feat"는 OpenType 레이아웃 기능 태그를 나타냅니다.

font-feature-settings: "feat" 1;

기능 태그 뒤의 "1" 값은 부울 토글입니다. 값을 지정하지 않으면 태그 뒤에 "1"이 있는 것처럼 선언이 처리됩니다. "0" 값은 태그를 해제합니다.

예를 들어 임의 합자가 포함된 글꼴에서 임의 합자를 사용하도록 설정하려면 다음 선언을 해당 선택기에 적용합니다.


font-feature-settings: "dlig" 1;

선택한 텍스트에 여러 OpenType 글꼴 기능을 구현하려면 각 해당 태그와 토글을 나열하고 쉼표로 구분합니다.


font-feature-settings: "dlig" 1, "ss02" 1, "case" 1;

이 글을 쓸 때 OpenType 레이아웃 기능을 지원하는 다른 브라우저는 Mozilla Firefox뿐이었으며 이 구문은 Internet Explorer 10 및 JavaScript를 사용하는 Windows 스토어 앱에서 지원되는 구문과 약간 다릅니다. 자세한 내용은 CSS 참조: Mozilla 확장(영문)을 참조하세요. CSS 글꼴 모듈 수준 3이 개발되면 해당 구문이 변경될 수 있습니다.

참고  공급업체 접두사 -ms-font-feature-settings를 사용하는 이 속성 버전은 이제 사용되지 않습니다. 향후 호환성을 보장하려면 공급업체 접두사와 함께 이 속성을 사용하는 응용 프로그램을 적절히 업데이트해야 합니다.

관련 항목

CSS
개발자용 Internet Explorer 10 가이드

 

 

표시:
© 2014 Microsoft