UNPKG

liser

Version:

functional css help to optimizing design work and building responsive websites

github.com/lamhieu-vk/liser

lamhieu-vk/liser

35 lines (33 loc) • 2.25 kB
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
.bg-center { background-repeat: no-repeat; background-position: center center; } .bg-top { background-repeat: no-repeat; background-position: top center; } .bg-right { background-repeat: no-repeat; background-position: center right; } .bg-bottom { background-repeat: no-repeat; background-position: bottom center; } .bg-left { background-repeat: no-repeat; background-position: center left; } @media screen and (min-width: 30em) { .bg-center-ns { background-repeat: no-repeat; background-position: center center; } .bg-top-ns { background-repeat: no-repeat; background-position: top center; } .bg-right-ns { background-repeat: no-repeat; background-position: center right; } .bg-bottom-ns { background-repeat: no-repeat; background-position: bottom center; } .bg-left-ns { background-repeat: no-repeat; background-position: center left; } } @media screen and (min-width: 30em) and (max-width: 60em) { .bg-center-m { background-repeat: no-repeat; background-position: center center; } .bg-top-m { background-repeat: no-repeat; background-position: top center; } .bg-right-m { background-repeat: no-repeat; background-position: center right; } .bg-bottom-m { background-repeat: no-repeat; background-position: bottom center; } .bg-left-m { background-repeat: no-repeat; background-position: center left; } } @media screen and (max-width: 60em) and (orientation: landscape) { .bg-center-ml { background-repeat: no-repeat; background-position: center center; } .bg-top-ml { background-repeat: no-repeat; background-position: top center; } .bg-right-ml { background-repeat: no-repeat; background-position: center right; } .bg-bottom-ml { background-repeat: no-repeat; background-position: bottom center; } .bg-left-ml { background-repeat: no-repeat; background-position: center left; } } @media screen and (min-width: 60em) { .bg-center-l { background-repeat: no-repeat; background-position: center center; } .bg-top-l { background-repeat: no-repeat; background-position: top center; } .bg-right-l { background-repeat: no-repeat; background-position: center right; } .bg-bottom-l { background-repeat: no-repeat; background-position: bottom center; } .bg-left-l { background-repeat: no-repeat; background-position: center left; } }