我正在尝试使用常规输入类型日期在移动设备上使用。但是在CSS中设置的宽度被Safari（或webkit）推翻。
我可以将-webkit-appearance: none;添加到CSS中，然后宽度将按预期工作。但后来我失去了所有其他想要的样式，例如箭头表示它是一个选择器。
有没有办法可以保持输入类型日期的基本样式，但我自己统计宽度？
答案 0 :(得分：11)
-webkit-appearance: none;总是删除选择器的典型样式......但您可以使用CSS和背景图像轻松添加箭头。
我不知道自定义样式输入的方法，但也保留箭头。
答案 1 :(得分：9)
添加-webkit-min-logical-width: <your desired value>。它解决了我的问题！
答案 2 :(得分：3)
如果您只想选择input[type='date']和input[type='time']
尝试这个CSS线。
input[type='date'], input[type='time'] {
-webkit-appearance: none;
}
答案 3 :(得分：1)
我发现按照@Boldizsar的说法，要获得100％的正确宽度，你需要一点CSS计算动作来移除iOS上的下拉箭头所添加的宽度。
-webkit-min-logical-width: calc(100% - 16px);