:read-write

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨2020年7月⁩.

:read-write は CSS の擬似クラスで、ユーザーが編集できる要素 (input や textarea など) を表します。

試してみましょう

構文

:read-write

例

読み取り専用/読み書きコントロールによるフォーム情報の確認

readonly のフォームコントロールの使用方法の一つは、ユーザーが以前のフォームに入力した情報 (例えば、配送方法の詳細など) をチェックして確認しながら、フォームの残りの部分と一緒に情報を送信することができるようにすることです。以下の例では、これを実現しています。

:read-only 擬似クラスは、入力欄をクリック可能なフィールドのように見せるスタイル付けをすべて削除するために使用されており、読み取り専用の段落のように見えます。一方、 :read-write 擬似クラスは、編集可能な <textarea> により良いスタイル付けを行うために使用されています。

完全なソースコードは readonly-confirmation.html にあります。以下のように表示されます。