html - rotate - css cross browser generator
Estableciendo uniform<input type="file"> width en todos los navegadores (3)
¿Qué combinación de CSS o atributos se necesitan?
Además del tutorial de modo peculiar, este es otro buen recurso: http://www.shauninman.com/archive/2007/09/10/styling_file_inputs_with_css_and_the_dom
Si está ocultando el control real, recuerde que es muy importante establecer la opacidad del control en cero, y no usar visibility: hidden . Hacer eso ocultará realmente el elemento, deshabilitando la acción de hacer clic.
Además, si está ocultando el control con un botón gráfico, tenga en cuenta que en algunos navegadores (Firefox e IE, creo), no podrá cambiar el tipo de cursor a una mano cuando esté sobre el texto. ingrese parte del control de archivo (siempre será la entrada predeterminada o el puntero normal sin enlace). Y sí, he intentado usar el cursor: pointer (y cursor: hand ).
Personalmente, he tenido problemas con los cuadros de carga personalizados, y no hay una solución mágica para conseguir que su aspecto o personalización sean perfectos. (especialmente con respecto al comportamiento del cursor, ya que considero que un UI trata de romper). Al final del día, creo que es más fácil aceptar que diferentes navegadores procesen el control de manera diferente, y así es como es.
- Ocultar el control real
- Hizo una DIV con los controles y el estilo que desea encima de ella
El botón no es un control HTML estándar.
Qué hay de malo en
<input type="file" size="50" .... />
? Se verá igual, excepto safari en Mac, supongo (en Mac, todos los controles de carga se ve diferente, en todos los navegadores)