cman.jp > WEBページ作成TOP > CSSリファレンス > 「テキスト入力時のIMEの状態」
WEBページ作成
広告
ime-mode「入力モード切替」
ime-modeは、入力モード（全角／半角切替）を行うプロパティですが、実装されているのはIEやFireFoxなど限られたブラウザのみとなります。
CSS3.0では非推奨となっており、実際にはHTML5で追加されたINPUTタグやJavaScriptによる実装（切替ではなくチェックのみ）で実現する必要があります。
<input> 「入力欄、選択入力、ボタン」
日本語入力（ime）制御
| CSS Ver. | 適用要素 | 継承 |
|---|---|---|
| 3.0 | input | 不可 |
広告
ime-modeの指定方法
| 構文 | |
|---|---|
|
ime-mode : [ auto | normal | active | inactive | disabled ]; |
|
| プロパティ | 意味 |
| ime-mode: auto; | 何もしません（デフォルト） |
| ime-mode: normal; | ページの標準モードに戻します。（IEなどは動作しません） |
| ime-mode: active; | 漢字（全角）モードにします |
| ime-mode: inactive; | 英数（半角）モードにします |
| ime-mode: disabled; | 英数（半角）モードにし、漢字（全角）モードに変更不可とします |
ime-mode のサンプル
<style type="text/css">
.ime-auto { ime-mode : auto;}
.ime-normal { ime-mode : normal;}
.ime-active { ime-mode : active;}
.ime-inactive { ime-mode : inactive;}
.ime-disabled { ime-mode : disabled;}
#sample1 input { width:100px }
</style>
<html>
<table id="sample1">
<tr>
<td>何もしない</td>
<td><input type="text" class="ime-auto" value="auto"></td>
</tr>
<tr>
<td>標準に戻す</td>
<td><input type="text" class="ime-nomal" value="nomal"></td>
</tr>
<tr>
<td>漢字(全角)モードにする</td>
<td><input type="text" class="ime-active" value="active"></td>
</tr>
<tr>
<td>英数(半角)モードにする</td>
<td><input type="text" class="ime-inactive" value="inactive"></td>
</tr>
<tr>
<td>英数(半角)モード固定にする</td>
<td><input type="text" class="ime-disabled" value="disabled"></td>
</tr>
</table>
</html>
| 何もしない | |
| 標準に戻す | |
| 漢字(全角)モードにする | |
| 英数(半角)モードにする | |
| 英数(半角)モード固定にする |
「ime-mode」は主要ブラウザで未対応のため、使用時には注意が必要です。
ページTOPベンダープレフィックスの使用
flexboxはCSS3で定義されています。このため、一部ブラウザによっては正常に動作しません。
対応状況→http://caniuse.com/#search=flex
このため、ベンダーフレックス「-webkit-」「-ms-」を利用した方が対応範囲が広がります。（上記サンプル参照）
広告