Html-атрибути disabled і readonly

Крім чекбоксів: .

Атрибути disable і readonly - це скорочені атрибути. тому їх можна використовувати без значень.

передача заблокованих і на сервер</h2> <p>Для передачі на сервер заблокованих (нередактіруемих) значень елементів, створених за допомогою <input> і <textarea>. необхідно використовувати атрибут readonly; однак він не змінює колір фону елемента за замовчуванням на сірого відтінку, на відміну від disabled. що може поставити Людини в глухий кут - чому Він не може редагувати вміст. В цьому випадку краще зробити імітацію заблокованості за допомогою CSS, тобто просто визначити елементу світло-сірий фон.</p><p>Цей ефект спостерігається у всіх популярних браузерах, крім Safari, який змінює колір фону елемента на сірого відтінку при застосуванні до нього атрибута readonly.</p> <h2>Приклад використання атрибута Disabled</h2> <h2>Приклад використання атрибута Readonly</h2> <h2>Readonly як Disabled</h2> <p>Як видно з прикладів вище, застосування різних атрибутів визначає різне стильове оформлення відповідних елементів. Щоб зробити його однаковим, можна використовувати наступний код CSS:</p> <p>Для Opera Presto друге правило не працює, тому в даному браузері, при отриманні фокусу текстової областю ( <textarea> ) З атрибутом readonly. навколо елемента буде відображатися пунктирна рамка.</p></div> <div class="extra"> <div class="clear"></div> </div> </article> </div> </div> </div> </div> <div id="sidebar" class="col-1-3"> <div class="wrap-col"> <div class="box"> <div class="content"> <ul> <li><a href="/articles/l-tiroksin-instrukcija-iz-zastosuvannja-cina.html">L-тироксин інструкція із застосування, ціна, відгуки - медикаменти, ліки - медичний портал -</a></li> <li><a href="/articles/poradi-trihologa-jak-dogljadati-za-volossjam.html">Поради трихолога як доглядати за волоссям</a></li> <li><a href="/articles/vitrati-ce.html">Витрати - це</a></li> <li><a href="/articles/dereva-z-biseru.html">Дерева з бісеру</a></li> <li><a href="/articles/jak-zv-jazati-izhachka-gachkom.html">Як зв’язати їжачка гачком</a></li> <li><a href="/articles/jak-diznatisja-rik-vipusku-avtomobilja-za-nomerom.html">Як дізнатися рік випуску автомобіля за номером кузова (vin, вин код), номеру двигуна, склу</a></li> <li><a href="/articles/viznannja-caricja-dokaziv.html">Визнання - цариця доказів</a></li> <li><a href="/articles/dekan-nn-ekonomika.html">Декан-нн - економіка</a></li> <li><a href="/articles/jak-pribrati-z-liki-krizhko-zahist-vid-ditej-pda.html">Як прибрати з ліки Крижко - захист від дітей pda - littleone 2018-2019</a></li> </ul> </div> </div> </div> </div> </div> </div> </section> <footer> <div class="wrap-footer pominodiko"> <div class="row"> <div class="col-1-1"> <div class="wrap-col"> <div class="box"> <div class="content"> <ul> <li><a href="/articles/tehnologichni-sposobi-virobnictva.html">Технологічні способи виробництва</a></li> <li><a href="/articles/odnojajcevi-i-raznojajcevie-bliznjuki.html">Однояйцеві і разнояйцевие близнюки</a></li> <li><a href="/articles/vidnoviti-prochitati-skopijuvati-podrjapanij-cd.html">Відновити (прочитати, скопіювати) подряпаний cd або dvd диск</a></li> <li><a href="/articles/shho-znachit-jakshho-vas-pereslidujut-pevni-chisla.html">Що значить, якщо вас переслідують певні числа</a></li> <li><a href="/articles/sonnik-med-prisnivsja-do-chogo-snitsja-med-uvi-sni.html">Сонник мед приснився до чого сниться мед уві сні - тлумачення снів</a></li> <li><a href="/articles/avtoperevezennja-svizhoi-polunici-po-vsejukaini.html">Автоперевезення свіжої полуниці по всейУкаіни, ТТК sapsan logistic</a></li> <li><a href="/articles/vi-koli-nebud-pomichali-sipannja-oka-os-shho-ce.html">Ви коли-небудь помічали сіпання ока ось що це означає</a></li> </ul> </div> </div> </div> </div> </div> </div> <div class="copyright"> <p>Copyright © 2026</p> <ul> <li><a href="/articles/jak-perevesti-spivrobitnika-na-gnuchkij-grafik.html">Як перевести співробітника на гнучкий графік роботи</a></li> <li><a href="/articles/rozdil-komplektnist-v-tu-i-sklad-virobu-forum.html">Розділ - комплектність - в ту і - склад виробу, форум розробників технічної документації</a></li> <li><a href="/articles/prikrasi-dlja-mashin-na-vesillja-kupiti-tovari-z.html">Прикраси для машин на весілля - купити товари з розділу прикраси для машин на весілля з</a></li> <li><a href="/articles/situacija-v-jakih-vipadkah-pasport-gromadjanina.html">Ситуація в яких випадках паспорт громадянина України підлягає вилученню (електронний журнал азбука права,</a></li> <li><a href="/articles/jak-rozpiznati-oznaki-anoreksii-u-molodih-divchat.html">Як розпізнати ознаки анорексії у молодих дівчат</a></li> </ul> </div> </footer></div> <style> #cookieNoticeOverlay{position:fixed;inset:0;z-index:999999;background:rgba(0,0,0,.72);display:none;align-items:center;justify-content:center;padding:20px}#cookieNoticeBox{width:100%;max-width:520px;background:#fff;border-radius:18px;padding:28px 24px;box-shadow:0 20px 60px rgba(0,0,0,.35);font-family:Arial,sans-serif;text-align:center}#cookieNoticeBox h2{margin:0 0 14px;font-size:24px;line-height:1.25;color:#111}#cookieNoticeBox p{margin:0 0 22px;font-size:16px;line-height:1.5;color:#333}#cookieNoticeOk{display:inline-block;width:100%;max-width:240px;border-radius:12px;padding:14px 22px;background:#111;color:#fff;font-size:17px;font-weight:700;text-decoration:none;box-sizing:border-box;cursor:pointer}#cookieNoticeOk:hover{background:#333}body.cookie-notice-locked{overflow:hidden} </style> <div id="cookieNoticeOverlay"> <div id="cookieNoticeBox" role="dialog" aria-modal="true"> <h2>Cookie на сайті</h2> <p>Ми використовуємо cookie для коректної роботи сайту та покращення сервісу.</p> </div> </div> <script> (function(){var storageKey='cookie_notice_ok_until';var showAgainAfter=246060*1000;var now=Date.now();function getAcceptedUntil(){try{return Number(localStorage.getItem(storageKey))||0}catch(e){return 0}} function setAcceptedUntil(value){try{localStorage.setItem(storageKey,String(value))}catch(e){}} if(getAcceptedUntil()>now){return} var overlay=document.getElementById('cookieNoticeOverlay');var okLink=document.getElementById('cookieNoticeOk');if(!overlay||!okLink){return} function showNotice(){overlay.style.display='flex';document.body.classList.add('cookie-notice-locked')} function closeNotice(){overlay.style.display='none';document.body.classList.remove('cookie-notice-locked')} okLink.addEventListener('click',function(event){event.preventDefault();setAcceptedUntil(Date.now()+showAgainAfter);var rawHref=(okLink.getAttribute('href')||'').trim();if(rawHref==='#'||rawHref===''){closeNotice();return} var targetUrl=new URL(rawHref,window.location.origin).href;window.open(targetUrl,'_blank','noopener,noreferrer');closeNotice()});overlay.addEventListener('click',function(event){event.stopPropagation()});document.addEventListener('keydown',function(event){if(overlay.style.display==='flex'&&event.key==='Escape'){event.preventDefault();event.stopPropagation()}},!0);showNotice()})() </script></body> </html>