영문 텍스트의 경우 css로 대문자 혹은 소문자로 변환

웹사이트를 만들다보면 특정 텍스트를 대문자로 노출시켜야할 때가 있거나 일괄 소문자로 표현해야할 때가 있습니다.

예를 들어 Please complete all required fields.. 라는 글로 아래의 변환방법을 쓰면

1. 대문자로 바꾸는 방법

CSS

1	text-transform:uppercase

결과는 PLEASE COMPLETE ALL REQUIRED FIELDS.

 

2. 소문자로 바꾸는 방법

CSS

1	text-transform:lowercase

 결과는 please complete all required fields.

 

3. 단어의 첫글자는 대문자로 나오게 할 경우

CSS

1	text-transform:capitalize

 결과는 Please Complete All Required Fields.

 

4. 기본 값은 

CSS

1	text-transform:none

 결과는  Please complete all required fields.

 

5. 부모의 요소값을 상속받을 경우에는

CSS

1	text-transform:inherit

 그러나 이 경우에는 브라우저 호환성에 문제가 있기 때문에 잘 쓰지 않는다. IE의 경우 9이상에서만 지원이 된답니다. ^^;