textarea readonly

HTML

<h1>Experiments in inactive controls</h1>


<h2>Disabled</h2>
<!-- I believe the autofocus attribute would not take effect if a control is disabled -->
<textarea disabled >
    But what thinks Lazarus? Can he warm his blue hands by holding them up to the grand northern lights? Would not Lazarus rather be in Sumatra than here? Would he not far rather lay him down lengthwise along the line of the equator; yea, ye gods! go down to the fiery pit itself, in order to keep out this frost?

Now, that Lazarus should lie stranded there on the curbstone before the door of Dives, this is more wonderful than that an iceberg should be moored to one of the Moluccas. Yet Dives himself, he too lives like a Czar in an ice palace made of frozen sighs, and being a president of a temperance society, he only drinks the tepid tears of orphans

But no more of this blubbering now, we are going a-whaling, and there is plenty of that yet to come. Let us scrape the ice from our frosted feet, and see what sort of a place this "Spouter" may be.
</textarea>

<h2>Readonly</h2>
<!-- I believe the autofocus attribute would still take effect if a control is readonly but there may be a jsfiddle bug here BC not working as expected -->
<textarea readonly autofocus>
    But what thinks Lazarus? Can he warm his blue hands by holding them up to the grand northern lights? Would not Lazarus rather be in Sumatra than here? Would he not far rather lay him down lengthwise along the line of the equator; yea, ye gods! go down to the fiery pit itself, in order to keep out this frost?

Now, that Lazarus should lie stranded there on the curbstone before the door of Dives, this is more wonderful than that an iceberg should be moored to one of the Moluccas. Yet Dives himself, he too lives like a Czar in an ice palace made of frozen sighs, and being a president of a temperance society, he only drinks the tepid tears of orphans

But no more of this blubbering now, we are going a-whaling, and there is plenty of that...

CSS

input[disabled], select[disabled], textarea[disabled] {background-color: #0f0;} /* lime green - works in IE7+ and modern browsers */

input[disabled="disabled"], select[disabled="disabled"], textarea[disabled="disabled"] {/*background-color:#ff0;*/} /* yellow -  IE8+ and modern browsers */

textarea:disabled { 
   /* background:#EBEBE4; */
   /* background: repeating-linear-gradient(60deg, white,  #eee 3px, #eee 6px);*/
   /* background: repeating-linear-gradient(60deg, white, white 35px, #8b0 35px, #8b0 70px);*/
    
    /*background-image: -webkit-linear-gradient(0, transparent 90%, rgba(255, 255, 255, .25) 50%);*/
    
    /*background: #6cab26;*/
background-image: url(IMAGE_URL); /* fallback */
/*background-image: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#999999)); *//* Saf4+, Chrome */
background-image: -webkit-linear-gradient(50deg,  white 90%,  rgba(255, 255, 255, .25) 50%); /* Chrome 10+, Saf5.1+ */
background-image: url(IMAGE_URL),    -moz-linear-gradient(top, #444444, #999999); /* FF3.6+ */
background-image: url(IMAGE_URL),     -ms-linear-gradient(top, #444444, #999999); /* IE10 */
background-image: url(IMAGE_URL),      -o-linear-gradient(top, #444444, #999999); /* Opera 11.10+ */
background-image:        linear-gradient(top, #444444, #999999); /* W3C */

}

JavaScript

#eee