본문 바로가기

Internet World/HTML/CSS

인풋박스(input) 기본입력 설정 ime-mode

인터넷에서 서식을 작성하다 보면 인풋박스( <input type="text" /> )에 글을 쓸때, 한글을 쓰려고 하면 영문이 나오고, 영문을 쓰려고 하면 한글이 나오고 해서 좀 답답할 때가 있을것이라 생각합니다. (저만 그런건가?) 아무튼, 그럴때 사용자를 조금만 더 생각한다면 답답하지 않고 사용하게 편할 수 있을 것 같습니다. 사용자를 배려하는 웹사이트 ㄱㄱ 출발!!

아주 간단합니다. 인풋박스를 가리키는 스타일에 "ime-mode"라는 속성을 주면 되는데요. 아래의 표를 참고하면 되겠네요.

 inactive default 로 영문모드
 active  default 로 한글모드
 auto  한/영 중 선택된 모드
 disable  영문만을 사용할 수 있는 모드

구체적인 사용방법은 이렇습니다.

<input type="text" style="ime-mode:inactive;" />

이런식으로 주면 되는데요. 뭐 어차피 스타일이기 때문에 이왕이면 스타일 시트에 주는게 낫겠지요?

<style type="text/css">
input.han {ime-mode:active;}
</style>

<input type="text" class="han" />

이렇게 사용하면 됩니다. "참~ 쉽죠잉~?"

이미지출처 : naradesign.net/ouif

참고적으로 위의 그림에서 보면 아이디와 이메일 부분은 영문이 기본이고 영문만 사용할 수 있게 하면 되고, 이름과 닉네임 부분에는 한글을 기본입력으로 해놓으면 사용자가 더 편할 것 같습니다.

그런데 매우 안타까운 점은 인터넷익스플로러에서만 되는 사실! 으악... 매우 서글프네요. 그래도 익스플로러를 대부분 사용하니 나름 다수의 사용자를 배려할 수 있겠지요? 아무튼 더 좋은 방법이 있다면 댓글이나 알려주시면 감사하겠습니다. ^^

작은 배려로 사용하기 더 편하게!
반응형