Este team de especialistas luego de ciertos días de trabajo y de juntar de datos, hallamos la solución, queremos que todo este artículo sea de gran utilidad para tu plan.
Solución:
WebKit pone a disposición los siguientes ocho pseudoelementos para personalizar el cuadro de texto de una entrada de fecha:
::-webkit-datetime-edit
::-webkit-datetime-edit-fields-wrapper
::-webkit-datetime-edit-text
::-webkit-datetime-edit-month-field
::-webkit-datetime-edit-day-field
::-webkit-datetime-edit-year-field
::-webkit-inner-spin-button
::-webkit-calendar-picker-indicator
Entonces, si pensó que la entrada de fecha podría usar más espacio y un esquema de color ridículo, podría agregar lo siguiente:
::-webkit-datetime-edit padding: 1em;
::-webkit-datetime-edit-fields-wrapper background: silver;
::-webkit-datetime-edit-text color: red; padding: 0 0.3em;
::-webkit-datetime-edit-month-field color: blue;
::-webkit-datetime-edit-day-field color: green;
::-webkit-datetime-edit-year-field color: purple;
::-webkit-inner-spin-button display: none;
::-webkit-calendar-picker-indicator background: orange; 
Actualmente, no existe una forma de diseñar un selector de fecha nativo sin secuencias de comandos y entre navegadores.
En cuanto a lo que sucede dentro de WHATWG/W3C… Si esta funcionalidad surge, probablemente estará bajo el estándar CSS-UI o algún estándar relacionado con Shadow DOM. La página wiki de CSS4-UI enumera algunas cosas relacionadas con la apariencia que se eliminaron de CSS3-UI, pero para ser honesto, no parece haber mucho interés en el módulo CSS-UI.
Creo que su mejor apuesta para el desarrollo de navegadores cruzados en este momento es implementar controles bonitos con una interfaz basada en JavaScript y luego deshabilitar la interfaz de usuario nativa de HTML5 y reemplazarla. Creo que en el futuro, tal vez habrá un mejor estilo de control nativo, pero tal vez sea más probable la capacidad de intercambiar un control nativo por su propio “widget” Shadow DOM.
Es molesto que esto no esté disponible, y siempre vale la pena solicitar soporte estándar. Aunque parece que el líder de jQuery UI lo intentó y no tuvo éxito.
Si bien todo esto es muy desalentador, también vale la pena considerar las ventajas del selector de fechas de HTML5 y también por qué los estilos personalizados son difíciles y tal vez deberían evitarse. En algunas plataformas, el selector de fechas se ve muy diferente y personalmente no puedo pensar en ninguna forma genérica de diseñar el selector de fechas nativo.
encontré esto en el github de Zurb
En caso de que quieras hacer un estilo más personalizado. Aquí está todo el CSS predeterminado para la representación de webkit de los componentes de fecha.
input[type="date"]
-webkit-align-items: center;
display: -webkit-inline-flex;
font-family: monospace;
overflow: hidden;
padding: 0;
-webkit-padding-start: 1px;
input::-webkit-datetime-edit
-webkit-flex: 1;
-webkit-user-modify: read-only !important;
display: inline-block;
min-width: 0;
overflow: hidden;
input::-webkit-datetime-edit-fields-wrapper
-webkit-user-modify: read-only !important;
display: inline-block;
padding: 1px 0;
white-space: pre;
valoraciones y comentarios
Si guardas algún recelo y capacidad de acrecentar nuestro escrito te insinuamos dejar una apostilla y con deseo lo observaremos.