HTML滑動條是一種常用的用戶界面組件,用于控制數值范圍內的選擇。在HTML中,我們可以通過使用標簽來創建滑動條。
<input type="range" min="0" max="100" step="1" value="50">
上面的代碼創建了一個數值范圍在0到100之間、每次移動1個單位的滑動條,初始值為50。其中,min屬性表示滑動條的最小值,max屬性表示滑動條的最大值,step屬性表示每次移動的單位,value屬性表示滑動條的初始值。
滑動條還支持一些事件,比如當滑動條的值發生變化時,可以觸發onchange事件。例如:
<input type="range" min="0" max="100" step="1" value="50" onchange="showValue(this.value)"> <script> function showValue(val) { console.log("當前滑動條的值為:" + val); } </script>
當滑動條的值發生變化時,會調用showValue函數,并將當前滑動條的值作為參數傳遞給它。showValue函數可以進行一些操作,比如更新顯示當前值的文本框、將值保存到數據庫等等。
上一篇html的跳轉代碼
下一篇CSS 屏幕適配方式