font-variant
font-variant는 소문자를 작은 대문자로 바꾸는 속성입니다. 즉, 소문자 크기의 대문자로 바꾸는 속성입니다. 따라서 한글에서는 의미 없는 속성입니다.
기본형
font-variant : normal | small-caps
- normal : 일반적인 형태로 표시합니다.
- small-caps : 소문자를 작은 대문자로 바꿉니다.
예제
예제 1
<h1 class="a">Lorem Ipsum Dolor.</h1>
<h1 class="b">Lorem Ipsum Dolor.</h1>
.a {
font-variant: normal;
}
.b {
font-variant: small-caps;
}
로딩 중... 잠시만 기다려주세요.
자바스크립트를 허용해주세요.
예제 2
다음은 font-weight 속성을 사용해 글자를 굵게 표시하고 font-variant 속성을 사용해 소문자를 작은 대문자로 표시한 예제입니다.
<span> 태그를 사용해 텍스트 문단 중 일부에만 스타일을
적용했습니다.
<h1>세계 3대 미항</h1>
<p><span class="accent">시드니(Sydney)</span>, 호주</p>
<p><span class="accent">리우데자네이루(Rio de Janero)</span>, 브라질</p>
<p><span class="accent">나폴리Naples)</span>, 이탈리아</p>
.accent {
font-variant: small-caps;
font-weight: bold;
}
로딩 중... 잠시만 기다려주세요.
자바스크립트를 허용해주세요.