問題：
要實現視覺上吸引人的範圍輸入，其中吸引人左側一側是綠色，右側是灰色。
解決方案：
實現此效果需要特定於瀏覽器的樣式。雖然純 CSS 解決方案是可能的，但它們會根據目標瀏覽器而有所不同。
Chrome 的 CSS 解：
IE 的CSS 解：
CSS 解決方案Firefox:
範例程式碼：
/* Chrome */
input[type='range']::-webkit-slider-thumb {
box-shadow: -80px 0 0 80px #43e5f7;
}
/* IE */
input[type="range"]::-ms-fill-lower {
background-color: #43e5f7;
}
/* Firefox */
input[type="range"]::-moz-range-progress {
background-color: #43e5f7;
}此CSS程式碼確保範圍輸入的左邊是綠色，右邊保持灰色，提供所需的視覺效果。
以上是如何使用兩種不同的顏色（綠色和灰色）來設定 HTML5 範圍輸入的樣式？的詳細內容。更多資訊請關注PHP中文網其他相關文章！
