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％的路程中順利完成任務。