<p>Вибери потрібне значення для <code>ime-mode</code>.</p>
<p>Редактор методів вводу (IME) дозволяє вставляти на сторінки символу китайського, корейського і японського алфавітів (ієрогліфи) і потім редагувати їх. IME - це основний і необхідний компонент для написання текстів на цих мовах. В алфавітах цих мов занадто багато символів, щоб їх можна було закодувати і розмістити на звичайній клавіатурі. </p>
<p>Зверніть увагу, на підтримку цієї <a href="https://css.in.ua/css/property/ime-mode">властивості браузерами!</a></p>
<div class="inputs">
<input id="auto" checked name="outline-style" type="radio"/>
<label for="auto">auto</label>
<message for="auto">Стан текстового поля не змінюється. За замовчуванням.</message>
<input id="active" name="outline-style" type="radio"/>
<label for="active">active</label>
<message for="active">Всі знаки розміщені через IME. Користувачі можуть деактивувати IME.</message>
<input id="inactive" name="outline-style" type="radio"/>
<label for="inactive">inactive</label>
<message for="inactive">Всі знаки розміщені без використання IME. Користувачі можуть активувати IME.</message>
<input id="disabled" name="outline-style" type="radio"/>
<label for="disabled">disabled</label>
<message for="disabled">IME повністю відключений. Його користувачі не можуть активувати IME, якщо елемент керування має фокус введення.</message>
</div>
<p id="message">Стан текстового поля не змінюється. За замовчуванням.</p>
<hr>
<input id="block" placeholder="text"></input>
* {
box-sizing: border-box;
padding: 0;
}
body {
text-align: center;
font-family: momospace;
font-size: 17px;
line-height: 1.5;
color: #222;
}
#form {
padding: 8px 16px;
font-size: 19px;
}
#block {
padding: 6px;
width: 275px;
margin: 75px auto 0 auto;
border: 1px solid #666;
}
#text {
height: 60px;
background-color: #eee;
padding: 16px 0;
}
message {
display: none;
}
var $message = $('#message');
$('.inputs').find('input').on('change', function() {
var $messageText = $("message[for='"+$(this).attr('id')+"']")
$message.text($messageText.text());
$('#block').css('ime-mode', $(this).attr('id'));
});
This Pen doesn't use any external CSS resources.