| <!DOCTYPE html> |
| <body> |
| <style> |
| input { |
| margin: 4px; |
| } |
| </style> |
| |
| <!-- no style for reference --> |
| <input type="range"> <br> |
| |
| <!-- border --> |
| <input type="range" style="border: 3px solid lime;"> |
| <input type="range" style="border-radius: 6px;"> <br> |
| |
| <!-- background --> |
| <input type="range" style="background: linear-gradient(to bottom, #dea 0%,#9c7 44%,#494 100%);"> <br> |
| |
| <!-- shadow --> |
| <input type="range" style="box-shadow: 4px 4px 10px rgba(255,0,0,0.5), inset 4px 4px 4px rgba(0,255,0,0.5);"> <br> |
| |
| <!-- size --> |
| <input type="range" style="width: 40px; height; 8px;"> |
| <input type="range" style="width: 40px; height; 16px;"> |
| <input type="range" style="width: 40px; height; 24px;"> <br> |
| |
| <!-- zoom --> |
| <input type="range" style="zoom: 1.5;"> |
| <input type="range" style="zoom: 2;"> <br> |
| </body> |