Plain <select>元素vs在移动设备上呈现的引导程序的下拉元素

Question

今天我学到了一些新东西，即<select>元素在桌面和移动浏览器上呈现完全不同。我之前没有使用它的问题以及我所做的几乎所有的事情都是通过使用Bootstrap的元素。 所以我的问题实际上是两个问题是以下几点：

1. 为什么<select>标签上的移动版Chrome和Chrome的桌面呈现不同的，当我在移动模式下进行调试？它是打算行为还是我可以把它看成是bug？例如，在开发移动模式和硬件设备上从桌面浏览器打开以下页面http://www.w3schools.com/tags/tag_select.asp，您将看到不同之处。

2. 在各种设备上实现一致性的最佳方法是什么？我可以肯定，在所有新的移动设备<select>将被渲染“以移动方式”，或者只是实现我自己的选择元素基于Bootstrap modal加上List group结合我在这里做的：http://codepen.io/anatoly314/pen/EPBmrM?editors=1010？

Answer 1

DevTools设备模式不会模拟移动特定的UA处理表单元素。这实际上是非常棘手的事情，因为这些东西是为该平台构建编译的。

要做的最好的事情是知道会有所不同。在选择元素的情况下，它并不重要。由于移动UX是选项的全屏滚动选择器。

绝对最好的事情，一如既往，就是使用设备模式作为指导。这不是绝对的，也不是。您将始终需要进行设备上测试，以验证所有工作是否按预期进行。 DM可以毫无问题地让你在85-90％的路程中顺利完成任务。