• 회원가입
  • 로그인
  • 구글아이디로 로그인

[DOM_Style] JS - fontVariant 속성 - (소문자/보통) 크기의 대문자로 설정/반환.

fontVariant 예제 - font-variant 속성값 설정.

 

<p id="hz">Homzzang.com</p>

<p>Homzzang.com</p>


<button type="button" onclick="homzzang()">클릭</button>

 

<script>

function homzzang() {

  document.getElementById("hz").style.fontVariant = "small-caps";

}

</script>

 

결과보기

 

fontVariant 정의 

 

소문자 크기의 대문자로 설정/반환.

 


 

1.

기본값: normal

반환값: 대문자 크기(예: normal, small-caps 등) 나타내는 문자열.

CSS속성: font-variant
CSS버전: CSS1

2.

모든 브라우저 지원. 

 

 

fontVariant 구문 

 

[반환]

object.style.fontVariant 

 

[설정]

object.style.fontVariant = "normal|small-caps|initial|inherit"

 


[속성값]

 

normal 
일반 폰트 (기본값)

small-caps
소문자 크기의 대문자로 변환. 
※ 영문에만 적용됨.

initial
이 속성의 기본값으로 지정

inherit

부모 요소의 스타일을 상속 

 

 

fontVariant 예제 - font-variant 속성값 반환.

 

<p id="hz" style="font-variant:small-caps">Homzzang.com</p>


<button type="button" onclick="homzzang()">클릭</button>

 

<script>

function homzzang() {

  alert(document.getElementById("hz").style.fontVariant);

}

</script>

 

결과보기

 


분류 제목
DOM_Style JS - columnSpan -
DOM_Style JS - columnWidth -
DOM_Style JS - content -
DOM_Style JS - counterIncrement -
DOM_Style JS - counterReset -
DOM_Style JS - cursor -
DOM_Style JS - direction 속성 - 텍스트방향 (= 텍스트진행방향 = direction속성 = 디렉션 속성)
DOM_Style JS - display 속성 ★ - 요소 표시 방법 설정/반환 (= display속성 = 디스플레이속성) 상…
DOM_Style JS - emptyCells -
DOM_Style JS - filter 속성 - 이미지필터효과 (= filter속성 = 필터속성) ※ 흑백이미지만들기
DOM_Style JS - flex -
DOM_Style JS - flexBasis -
DOM_Style JS - flexDirection -
DOM_Style JS - flexFlow -
DOM_Style JS - flexGrow 속성 - 동일컨테이너 안 나머지 플렉스아이템에 비해 얼마나 커질지 지정 (= 플렉스…
DOM_Style JS - flexShrink 속성 - 동일컨테이너 안 나머지 플렉스아이템에 비해 얼마나 줄어들지 지정 (= …
DOM_Style JS - flexWrap -
DOM_Style JS - cssFloat 속성 - ★ - 요소나란히 (= 요소한줄로 = 요소가로로 = 요소옆으로정렬 = 플로…
DOM_Style JS - font 속성 ★ - 글자스타일종합 (= font속성 = 글씨체 = 서체 = 글꼴 = 폰트속성, 상…
DOM_Style JS - fontFamily 속성 ★ - 폰트 종류 설정/반환. (= 글꼴 종류 = fontFamily속성 …
46/67
목록
찾아주셔서 감사합니다. Since 2012