단일 @font-face 쿼리로 여러 글꼴 두께를 정의할 수 있나요?
Klavika 글꼴은 다양한 두께와 모양으로 제공됩니다. 가중치를 지정하는 단일 @font-face 쿼리를 사용하여 이러한 항목을 CSS로 가져올 수 있습니까?
해결책:
@font-face의 다양한 기능을 소개합니다. 다양한 스타일과 두께를 단일 글꼴 모음 이름과 연결할 수 있습니다.
@font-face { font-family: "DroidSerif"; src: url("DroidSerif-Regular-webfont.ttf") format("truetype"); /* Normal weight, normal style */ src: url("DroidSerif-Italic-webfont.ttf") format("truetype"); /* Normal weight, italic style */ src: url("DroidSerif-Bold-webfont.ttf") format("truetype"); /* Bold weight, normal style */ src: url("DroidSerif-BoldItalic-webfont.ttf") format("truetype"); /* Bold weight, italic style */ }
이제 글꼴 무게:bold 또는를 지정할 수 있습니다. 다양한 요소에 대한 글꼴 스타일:기울임꼴:
body { font-family:"DroidSerif", Georgia, serif; } h1 { font-weight:bold; } em { font-style:italic; } strong em { font-weight:bold; font-style:italic; }
이 기능에 대한 자세한 내용은 공식 문서를 참조하세요.
예:
[펜 예시](https://codepen.io/anon/pen/EjxVqv)
위 내용은 단일 @font-face 쿼리에서 여러 글꼴 가중치를 정의할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!