tamaño - Deshabilitar un cuadro de texto usando CSS
ocultar placeholder css (7)
** solo copie y pegue este código y ejecútelo, puede ver el cuadro de texto deshabilitado **
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style>.container{float:left;width:200px;height:25px;position:relative;}
.container input{float:left;width:200px;height:25px;}
.overlay{display:block;width:208px;position:absolute;top:0px;left:0px;height:32px;}
</style>
</head>
<body>
<div class="container">
<input type="text" value="[email protected]" />
<div class="overlay">
</div>
</div>
</body>
</html>
Cómo deshabilitar un cuadro de texto en CSS? Actualmente tenemos un cuadro de texto en nuestra vista que se puede activar / desactivar dependiendo de una propiedad en el modelo. Estamos teniendo asp.net MVC view; dependiendo del valor de la propiedad del Modelo, necesitamos renderizar un cuadro de texto o un cuadro de texto de solo lectura. estábamos pensando en hacer esto aplicando CSS al control de vista. ¿Alguien ha hecho esto antes?
CSS no puede desactivar el cuadro de texto; sin embargo, puede desactivar la visualización o la visibilidad.
display: none;
visibility: hidden;
O también puedes configurar el HTMLattribute:
disabled="disabled"
No puede deshabilitar un cuadro de texto en CSS. Deshabilitarlo no es una tarea de presentación, tendrás que hacer esto en el marcado HTML usando el atributo disabled .
Puede armar algo colocando el cuadro de texto debajo de un elemento transparente absolutamente posicionado con índice z ... Pero eso es una tontería, y además necesitaría un segundo elemento HTML.
Sin embargo, puede decodificar cuadros de texto deshabilitados (si eso es lo que quiere decir) en CSS usando
input[disabled] { ... }
desde IE7 hacia arriba y en todos los otros navegadores principales.
No se puede deshabilitar nada con CSS, eso es un problema funcional. CSS está diseñado para problemas de diseño. Puede dar la impresión de que se está deshabilitando un cuadro de texto, al configurar colores descoloridos.
Para deshabilitar realmente el elemento, debe usar el atributo booleano desactivado:
<input type="text" name="lname" disabled />
Demostración: http://jsfiddle.net/p6rja/
O, si lo desea, puede configurar esto a través de JavaScript:
document.forms[''formName''][''inputName''].disabled = true;
Demostración: http://jsfiddle.net/655Su/
Tenga en cuenta que las entradas desactivadas no pasarán sus valores cuando publique datos en el servidor. Si desea retener los datos, pero no permite editarlos directamente, puede que le interese configurarlos en su lugar.
// Similar to <input value="Read-only" readonly>
document.forms[''formName''][''inputName''].readOnly = true;
Demostración: http://jsfiddle.net/655Su/1/
Esto no cambia la UI del elemento, por lo que tendrías que hacer eso tú mismo:
input[readonly] {
background: #CCC;
color: #333;
border: 1px solid #666
}
También puedes orientar cualquier elemento inhabilitado:
input[disabled] { /* styles */ }
Solo prueba esto.
<asp:TextBox ID="tb" onkeypress="javascript:return false;" width="50px" runat="server"></asp:TextBox>
Esto no permitirá que se ingresen caracteres dentro del TextBox.
Yendo más lejos en la respuesta de Pekka, tenía un estilo "style1" en algunos de mis cuadros de texto. Puede crear un "estilo1 [deshabilitado]", de modo que solo aplique estilo a los cuadros de texto deshabilitados con el estilo "estilo1":
.style1[disabled] { ... }
Funcionó bien en IE8.
puedes deshabilitar a través de css:
pointer-events: none;
No funciona en todas partes sin embargo.