summaryrefslogtreecommitdiffstats
path: root/third_party/WebKit/LayoutTests/fast/forms/checkbox/checkbox-appearance-basic.html
blob: 07b4657b39bd013565d647663927ee3fdfeaad08 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<!DOCTYPE html>
<body>
<style>
input {
    margin: 4px;
}
</style>

<!-- no style for reference -->
<input type="checkbox"> 
<input type="checkbox" checked>
<br>

<!-- border -->
<input type="checkbox" style="border: 3px solid lime;">
<input type="checkbox" style="border-radius: 6px;"> <br>

<!-- background -->
<input type="checkbox" style="background: linear-gradient(to bottom, #dea 0%,#9c7 44%,#494 100%);"> <br>

<!-- shadow -->
<input type="checkbox" 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="checkbox" style="width: 8px; height; 8px;">
<input type="checkbox" style="width: 16px; height; 16px;">
<input type="checkbox" style="width: 24px; height; 24px;"> <br>

<!-- zoom -->
<input type="checkbox" style="zoom: 1.5;" id="zoomed15">
<input type="checkbox" style="zoom: 2;"> <br>
<script>
document.querySelector('#zoomed15').focus();
</script>
</body>