Как установить свойство только для чтения текстового поля из CSS

Question

я создаю код CSS, как

.inputHide {
    font-size       : 100px;
    width           : 100px;
    height          : 100px;
    border          : none;
    background      : transparent;
    readonly        : true;
}

Но это не работает. Хотя, если я использую размер шрифта 1px, то с помощью вкладки я могу получить доступ к этому текстовому полю и изменить его значение.

Есть ли способ сделать текстовое поле доступным только для чтения, просто используя css ..

Answer 1

Для людей, которые приходят к этому ответу сейчас. Вы можете сделать это сейчас с

pointer-events: none;

Answer 2

Вы не устанавливаете поведение элементов управления через CSS, только их стилизацию - если вам нужно сделать его доступным только для чтения, отметьте его как таковой на фактическом элементе управления

Answer 3

Только чтение не является атрибутом STYLE. Таким образом, вы не можете установить с помощью CSS (каскадный лист STYLE).

Answer 4

Я согласен с Rowland, но вы можете установить его без редактирования с помощью:

.inputHide {
    display: none;
}

хотя это выводит его из потока (так что происходит заметное движение элементов, чтобы заполнить пустоту, оставленную вашим текстовым полем).

Этот метод делает его полностью невидимым и недоступным для редактирования ... не только видимым и неактивным (как это делают атрибуты HTML "disabled" или "readonly").

Answer 5

$("select").selectize({
        onInitialize: function() {
            this.$control_input.attr("readonly","readonly");

        }
    });

Answer 6

css нельзя использовать для ввода только для чтения. Вы можете использовать jquery или простой javascript для изменения свойств полей.