1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<!DOCTYPE html>
<style>
.x { width: 200px; height: 100px; display: inline-block; }
.a { background: -moz-linear-gradient(top -90deg, blue, white, red); }
.e { background: -moz-linear-gradient(top right -2.03444394rad, blue, white, red); }
.g { background: -moz-linear-gradient(right 180deg, blue, white, red); }
.i { background: -moz-linear-gradient(bottom right 2.03444394rad, blue, white, red); }
.k { background: -moz-linear-gradient(bottom 90deg, blue, white, red); }
.m { background: -moz-linear-gradient(bottom left 1.10714872rad, blue, white, red); }
.o { background: -moz-linear-gradient(left 0deg, blue, white, red); }
.q { background: -moz-linear-gradient(top left -1.10714872rad, blue, white, red); }
</style>
<div class="x a"></div>
<div class="x e"></div>
<div class="x g"></div>
<div class="x i"></div>
<div class="x k"></div>
<div class="x m"></div>
<div class="x o"></div>
<div class="x q"></div>
|
