CSSで入力フォームのinputをdisabledにする方法

厳密にいうと、フォームをクリックできなくする方法、です

javascriptでdisableをtrueにしたり、falseにしたりすることはできますが、CSSでdisableをtrueにする（ような動作となる）方法です。

厳密に言うと、値はサーバーへ送信されるので、disableというよりreadonlyになる方法です。

[adsense]

ワードプレスの購読者ユーザーに自身のメールアドレスを変更させたくない、けど、フロントエンドのプロフィール画面でメールアドレスは確認できるようにしたい、という感じです。

input部分に登録済みのメアドはvalueとして表示されますが、クリックできなくすることで変更できなくしました。

htmlがこんな感じだとすると、

<input type="text" name="email" id="email" />

cssはこんな感じです。

input#email{
	pointer-events : none;
}