扩大日期输入按钮的可点击区域

Question

5

我有一个日期输入元素。

<input type="date" >

以下是默认的按钮可点击打开日期选择器的红色区域：

我想知道是否可能增加这个区域以使其更容易点击，类似于这样更宽的区域：

可以使用HTML、JavaScript或CSS来解决。

- stramin

默认情况下，输入框的整个宽度都是可点击的，您不必特别点击图标来打开日历。或者也许这取决于浏览器，哪个浏览器强制您点击图标？ - Teemu

我尝试了Chrome、Opera和Edge，我必须点击那个区域才能打开日期选择器。 - stramin

啊...在火狐浏览器中好像有不同的工作方式。 - Teemu

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- User863 · Accepted Answer

尝试使用::-webkit-calendar-picker-indicator 伪元素。

#date-inp::-webkit-calendar-picker-indicator {
  padding-left: 100px;
  border: 1px dashed red;
}

<input type="date" id="date-inp"/>