html - tamaño - ¿Cómo hago una entrada de texto no editable?

tamaño de input text css

Question

Así que tengo una entrada de texto

<input type="text" value="3" class="field left">

Aquí está mi CSS para ello

background:url("images/number-bg.png") no-repeat scroll 0 0 transparent;
border:0 none;
color:#FFFFFF;
height:17px;
margin:0 13px 0 0;
text-align:center;
width:17px;

¿Hay una configuración o un truco para esto? Estaba pensando en hacer una etiqueta, pero ¿qué hay del estilo? ¿Cómo los convierto y hay una forma mejor o es la única?

Answer 1

Puede agregar el atributo de readonly a la entrada:

<input type="text" value="3"
class="field left" readonly="readonly">

Más información: http://www.w3schools.com/tags/att_input_readonly.asp

Answer 2

Puede usar el atributo de readonly , si desea que solo se lea su entrada. Y puede usar el atributo disabled , si desea que se muestre la entrada, pero deshabilitado por completo (incluso los lenguajes de procesamiento como PHP no podrán leerlos).

Answer 3

Solo necesitas añadir deshabilitado al final.

<input type="text" value="3" class="field left" disabled>

Answer 4

Solo para completar las respuestas disponibles:

Un elemento de entrada puede ser de solo lectura o deshabilitado (ninguno de ellos es editable, pero hay un par de diferencias: enfoque, ...)

Buena explicación se puede encontrar aquí:
¿Cuál es la diferencia entre disabled = "disabled" y readonly = "readonly" para los campos de entrada de formulario HTML?

Cómo utilizar:

<input type="text" value="Example" disabled />
<input type="text" value="Example" readonly />

También hay algunas soluciones para hacerlo a través de CSS o JavaScript como se explica here .

Answer 5

agregar el atributo de solo lectura

<input type="text" value="3" class="field left" readonly="readonly" >

o -

<input type="text" value="3" class="field left" readonly>

no se necesita css

Answer 6

<input type="text" value="3" class="field left" readonly>

No requiere estilismo.

Consulte <input> en MDN https://developer.mozilla.org/en/docs/Web/HTML/Element/input#Attributes

Answer 7

<input type="text" value="3" class="field left" readonly>

Puede ver en https://www.w3schools.com/tags/att_input_readonly.asp

El método para establecer "readonly":

$("input").attr("readonly", true)

para cancelar "readonly" (trabajar en jQuery):

$("input").attr("readonly", false)