|
1 <!DOCTYPE html> |
|
2 <html> |
|
3 <link rel='stylesheet' type='text/css' href='style.css'> |
|
4 <style> |
|
5 div:nth-child(1) > .meter-sub-optimum { width: 10%; } |
|
6 div:nth-child(2) > .meter-sub-sub-optimum { width: 10%; } |
|
7 div:nth-child(3) > .meter-sub-optimum { width: 40%; } |
|
8 div:nth-child(4) > .meter-optimum { width: 10%; } |
|
9 div:nth-child(5) > .meter-optimum { width: 0%; } |
|
10 div:nth-child(6) > .meter-sub-optimum { width: 20%; } |
|
11 </style> |
|
12 <body> |
|
13 <div class="meter-element"> |
|
14 <div class="meter-sub-optimum"> |
|
15 </div> |
|
16 </div> |
|
17 <div class="meter-element"> |
|
18 <div class="meter-sub-sub-optimum"> |
|
19 </div> |
|
20 </div> |
|
21 <div class="meter-element"> |
|
22 <div class="meter-sub-optimum"> |
|
23 </div> |
|
24 </div> |
|
25 <div class="meter-element"> |
|
26 <div class="meter-optimum"> |
|
27 </div> |
|
28 </div> |
|
29 <div class="meter-element"> |
|
30 <div class="meter-optimum"> |
|
31 </div> |
|
32 </div> |
|
33 <div class="meter-element"> |
|
34 <div class="meter-sub-optimum"> |
|
35 </div> |
|
36 </div> |
|
37 </body> |
|
38 </html> |