Псевдокласси read-only

Псевдокласси read-only услубро барои input-ҳое, ки attribute-и readonly доранд, муайян мекунад. Чунин input танҳо барои хондан пешбинӣ шудааст, яъне ворид кардан ё тағйир додани дар он маълумот имконнопазир аст, аммо онҳоро метавон интихоб кард ва нусха бардошт.

Синтаксис

cssинтихобкунанда:read-only {
  
}

Мисол

Биёед барои input-е, ки танҳо барои хондан пешбинӣ шудааст, ҳудудҳои ранги хокистарӣ таъин кунем:

html<p>
  <label>Матн ворид кунед</label>
  <input type="text">
</p>
<p>
  <label>Матни хонданӣ</label>
  <input type="text" value="матн" readonly>
</p>

cssinput:read-only {
  border: 1px solid #D8DFE8;
}

Результат:

Инчунин нигаред

псевдокласси :read-write,
ки услубро барои input-ҳои дастрас барои тағйир додан муайян мекунад
псевдокласси :default,
ки услубро барои элементҳои пешфарз муайян мекунад
псевдокласси :indeterminate,
ки услубро барои тугмаҳои гунҷониш, ки дар ҳолати номуайян қарор доранд, муайян мекунад
псевдокласси :optional,
ки услубро барои input-е, ки attribute-и required надорад, муайян мекунад
псевдокласси :placeholder-shown,
ки услубро барои элементҳо ҳангоми намоиши матни ёрдамчӣ муайян мекунад
псевдокласси :required,
ки услубро барои input-е, ки attribute-и required дода шудааст, муайян мекунад
псевдокласси :focus-within,
ки услубро барои элементҳои дар фокуси қарордошта муайян мекунад
хосияти caret-color,
ки ранги курсори матнро дар input муайян мекунад