본문 바로가기
웹프로그래밍/HTML, CSS

[CSS] input [type=text] 기본입력 한글로 세팅하기

웹페이지의 완성도를 위해서 input type text부분에 커서를 위치하고 키보드로 정보를 입력했을 때 기본적으로 한글이 입력되도록 해달라는 요청을 받았다. 결과를 먼저 이야기 하자면 여기저기서 많이 찾아본 결과 익스플로러에서는 css를 통해서 간단히 수정이 가능했지만 크롬에서의 방법은 없는 것을 잠정 결론을 내렸다 -_-;;

 

따라서 이 포스팅을 보는 사람들은 익스플로러라도 해당기능을 적용하고 싶다면 아래의 코드를 사용하면 되며 크롬에도 적용되는 방법을 찾고 싶다면 나를 믿고 포기하거나 다른곳에서 좀 더 정보를 찾아보길 바란다(혹시라도 방법을 찾으면 댓글로 남겨주었으면 좋겠다...)

 

 

 

 

 

CSS코드 수정

input[type=text]{
  -webkit-ime-mode:active;
  -moz-ime-mode:active;
  -ms-ime-mode:active;
  ime-mode:active;
}

일부 블로그에서 이렇게하면 크롬에도 적용이 된다고 적어둔 곳이 있는데 크롬에서는 역시나 동작을 안한다.

 

 

input[type=text] {
  ime-mode:active;
}

따라서 순순히 포기하고 익스플로러에만 적용하는 것을 추천하며, 나는 익스플로러와 크롬만에서만 적용할 예정이라 파이어폭스나 다른프라우저는 테스트를 안해봤기 때문에 다른브라우저에도 적용이 되는지는 확인이 필요하다.

 

 

input[type=text]{
  -moz-ime-mode:active;
}

당연히 파이어포스에서도 동작하게 설정하려면 위와 같이 작성해야 한다.(정상적으로 동작하는지 확인은 안해봤지만..)

 

 

 

 

 

추가적으로 ime-mode에서 지원하는 속성값을 적어두었는데 사용하는데 참고하면 도움이 될거라고 생각한다.

 

auto : 기존 값

normal : 기본 값

active :  IME기본 설정 언어(한글로 되어있으면 한글)로 입력됨.

inactive : 영문이 기본으로 설정됨

disabled : 한/영 전환키를 사용해도 영문으로만 입력됨.

'웹프로그래밍 > HTML, CSS' 카테고리의 다른 글

[CSS] html의 css초기화 reset.css 적용방법  (0) 2019.05.04

댓글