شبه کلاس read-only: در CSS

:read-only Pseudo-class

شبه کلاس read-only: در CSS، عناصری مانند <input> و <textarea> را هدف می گیرد که قابل ویرایش توسط کاربر نباشند.

نکته: این انتخابگر تنها عناصر <input>/<textarea> که صفت readonly داشته باشند را انتخاب نمی کند، بلکه تمام عناصری را که توسط کاربر قابل ویرایش نباشند را انتخاب می کند.

در مثال زیر میتوانیم عملکرد این شبه کلاس را ببینیم:

html

<input type="text" value="میتوانید در اینجا هر چیزی بنویسید">
<input type="text" value="این یک فیلد read-only است." readonly>
<p>این یک پاراگراف عادی است.</p>
<p contenteditable="true">شما میتوانید این پاراگراف را ویرایش کنید!</p>

css

input { min-width: 25em; }
input:-moz-read-only { background: cyan; }
input:read-only { background: cyan; }

p:-moz-read-only { background: lightgray; }
p:read-only { background: lightgray; }
p[contenteditable="true"] { color: blue; }

مشاهده و ویرایش کد در حالت تمام صفحه

پشتیبانی مرورگرها
تمام مرورگرها بجز Internet Explorer از این شبه کلاس در CSS پشتیبانی می کنند.