[html/css] css 로 대소문자 변경하는 방법

[html/css] css 로 대소문자 변경하는 방법

 

 

 

특정 태그안에 있는 영문 텍스트를

 

전체 대문자 혹은 소문자로

 

변경해야 된는 경우

 

아래처럼 css style 옵션중의 하나인

 

text-transform 을 이용하면

 

쉽게 변경할 수 있습니다.

 

 

우선 아래와 같이 Test 라는

 

대소문자가 섞여있는 텍스트가 있다고 가정하고,

<span>Test<span>

 

전체 대문자로 변경하고 싶으면 아래와같이

text-transform: uppercase 를 사용하고

<span style="text-transform :uppercase">Test<span>
// result : TEST

 

전체 소문자로 변경하고 싶으면 아래와같이

text-transform: lowercase 를 사용하면 됩니다.

<span style="text-transform :lowercase">Test<span>
// result : test

 

위 내용처럼

 

간단하게 

text-transform: uppercase

text-transform: lowercase

의 스타일 옵션을 추가하면

 

변경이 가능합니다!

 

참고들 하세요!