Create Read-Only input text field in HTML and CSS

Description

The following code shows how to create Read-Only input text field.

Example


<!-- w ww.  j a  v a  2  s .c o  m-->
<!DOCTYPE HTML>
<html>
<body>
<form>
<label for="name"> Name:
<input value="Adam" disabled id="name" name="name" />
</label>
<label for="city"> City:
<input value="Boston" readonly id="city" name="city" />
</label>
<label for="fave"> Survey: <input id="fave" name="fave" />
</label>
<button type="submit">Submit Vote</button>
</form>
</body>
</html>

Click to view the demo

The code above generates the following result.

Create Read-Only input text field in HTML and CSS

Home »
  HTML CSS Tutorial »
    Form »
      Form Element

HTML CSS Tutorial Form Element
Create HTML form Radio Buttons in HTML and ...
Create Legend with accesskey in HTML and CS...
Create Radio buttons in HTML and CSS
Create a Hidden control in HTML and CSS
Create a Password input control in HTML and...
Create a file upload control in HTML and CS...
Organize Elements With fieldset and legend ...
Set Tabbing Order using the tabindex Attrib...
Set input element max size with maxlength a...
Set up form action Attribute in HTML and CS...
Use the accesskey Attribute in HTML and CSS
Create a form with text input and button in...
Create Button control with button element i...
Create Button with input element in HTML an...
Create HTML form Buttons in HTML and CSS
Create a Checkbox in HTML and CSS
Add labels to a form to provide some contex...
Link label and input element with label for...
Use the label element in HTML and CSS
Add size Attribute to select element in HTM...
Add Structure to a select Element by using ...
Create Drop down select boxes in HTML and C...
Create HTML form Drop-Down in HTML and CSS
Create Scolling select boxes in HTML and CS...
Create Select boxes with multiple selection...
Create Select box with optgroup in HTML and...
Creating groups of options with a disabled ...
Make select element multiple selectable in ...
Pre-select a drop down list item in HTML an...
Create a Multi-line text input control in H...
Create a Single line text input control in ...
Create disabled text boxes in HTML and CSS
Create form text fields in HTML and CSS
Create HTML Form TextArea and set row and c...

Create Read-Only input text field in HTML a...

Set input text field initial value in HTML ...
Set input text field placeholders in gray t...
Set input text field size in HTML and CSS
Disable input Elements in HTML and CSS
Create a contact form in HTML and CSS