需要一些创建html表单的建议吗？

Question

通过select标签制作这样的元素是否正确？我怀疑，因为那时需要在选项中设置太多的值，但select标签对于移动设备来说是最舒服的。

Answer 1

一个非常大的<input type=date>怎么样？

  日期类型的

<input>元素创建输入字段，允许轻松输入日期 - 包括年，月和日，但不包括时间。

     

控件的UI通常因浏览器而异;目前支持不完整，请参阅浏览器兼容性以获取更多详细信息。在不受支持的浏览器中，控件会优雅地降级为简单的<input type="text">。

Can I Use: Date and time input types?

＆＃13;

＆＃13;

input[type=date] {
  font-size: 3em;
}

＆＃13;

<input type=date value="2017-07-29">

＆＃13;

＆＃13;

＆＃13;

可替换地;使用<input type=number>

如果用户界面至少与用户体验一样重要，那么您可以使用三个<input type=number>个元素set min and max attributes。

  

您可以使用min和max属性指定字段可以包含的最小值和最大值。

虽然这并没有提供<input type=date>的默认处理，并且需要通过JavaScript执行验证，但它确实提供了良好的可访问性，并且至少validation that the input values are numbers可以使用轻松创建Date object。

＆＃13;

＆＃13;

form {
  display: inline-block;
  white-space: nowrap;
  font-size: 2em;
  font-family: sans-serif;
  background: #1f373e;
  color: #aaa;
}
fieldset {
  border: 0;
}
fieldset:before {
  position: absolute;
  white-space: pre-line;
  content: "Date\A";
}
input {
  width: 3ch;
  margin: 1.5em 0 .5em;
  padding: .4em 0 .4em .4em;
  font-size: inherit;
  font-family: Consolas, monospace;
  outline: 0;
  border: 0;
  border-radius: .2em;
}
input:first-child {
  width: 5ch;
}

＆＃13;

<form>
  <fieldset>
    <input type="number" placeholder="YYYY" name="year" min="1900" max="2100"> &ndash;
    <input type="number" placeholder="MM" name="month" min="1" max="12"> &ndash;
    <input type="number" placeholder="DD" name="day"min="1" max="31">
  </fieldset>
</form>

＆＃13;

＆＃13;

＆＃13;

Answer 2

是的，这是select标签的可能用例。正如你所看到的那样 this link，您可以为日期设置<option value="1989">1989</option>等选项值。