Disabled selector in CSS3

How to apply style of un-editable input text element of HTML in CSS3?

By using Disabled selector we can create the uneditable input text element of HTML. This is mostly used on form elements.

<style>
        input {
            background: lightgreen;
        }

        input[type=text]:disabled {
            background-color: seashell;
        }
</style>

<body>
    <form>
        <fieldset>
            <legend>Enter Details</legend>
            Username
            <input type="text" value="Username(Enabled)" /><br />
            Password
            <input type="Text" value="password(Enabled)" />
            <br />
            Disabled text
            <input type="text" disabled="disabled" value="Sheo Narayan(Disabled)" />
        </fieldset>
    </form>
</body>

In the above code snippet diabled is applied to the <input> element, the content inside the input text box element remains same, we cannot edit that text. That is shown clearly in the DEMO URL.

OUTPUT