iphone - apple-mobile-web-app-status-bar-style

Aplicación web para iPhone-tipo=problema de sombra interna de texto

Question

Estoy intentando deshabilitar la sombra interior superior en el campo de texto de entrada = que se aplica de forma predeterminada en iPhone ¿Alguna idea de como hacer esto? Intenté sobrescribir -webkit-box-shadow sin éxito.

texto alternativo http://feedsmanagement.com/example.png

aclamaciones

Answer 1

Encontré que la respuesta de Jamin era mejor por ahora. Si utilizo el -webkit-appearance: none , en el iPad ya no se aplican mis estilos de enfoque (pseudo-clase) cuando se selecciona un área de texto / entrada. Me arruina un poco el estilo de mi forma porque las áreas de texto / entradas que no están enfocadas son significativamente moderadas.

Answer 2

He tenido este mismo problema, queriendo mostrar los campos de texto de entrada que tienen un estilo: SIN sombras. Mi solución (funciona perfectamente en iPad / iPhone) crea un gif de fondo que es completamente transparente. Aplica ese estilo a tu campo de entrada. Mi código era:

.textBox input {border: none; fondo: url (../ images / bg_inputFix.gif); }

-Jamin

Answer 3

Hice el gradiente de fondo y no funciona, también encontré una variación de él:

input[type=''text'']{
-webkit-border-radius: 0;
background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(hsla(0,0%,100%,0)), to(hsla(0,0%,100%,0)));
background-image:-webkit-linear-gradient(hsla(0,0%,100%,0), hsla(0,0%,100%,0));
}

y eso tampoco ha funcionado :(

Answer 4

Puede agregar un degradado de imagen de fondo para eliminar la sombra interna; imagen de fondo: -webkit-gradiente (lineal, 0% 0%, 0% 100%, desde (rgb (255,255,255)) hasta (rgb (255,255,255)));

Answer 5

¿Ha intentado usar -webkit-appearance: none aplicando un borde personalizado como el border: 1px solid black;

No puedo probar esto en este momento.

Answer 6

-webkit-appearance:caret;

Debería eliminar solo las sombras insertadas en sus entradas