source: spip-zone/_plugins_/bootstrap/trunk/bootstrap/css/mixins/image.less @ 90741

Last change on this file since 90741 was 90741, checked in by cedric@…, 4 years ago

BS 3.3.5 dans la place, work in progress
le plugin passe en v3 dev
On s'occupera de la couche de compat BSv2 dans un second temps

File size: 1.0 KB
Line 
1// Image Mixins
2// - Responsive image
3// - Retina image
4
5
6// Responsive image
7//
8// Keep images from scaling beyond the width of their parents.
9.img-responsive(@display: block) {
10  display: @display;
11  max-width: 100%; // Part 1: Set a maximum relative to the parent
12  height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
13}
14
15
16// Retina image
17//
18// Short retina mixin for setting background-image and -size. Note that the
19// spelling of `min--moz-device-pixel-ratio` is intentional.
20.img-retina(@file-1x; @file-2x; @width-1x; @height-1x) {
21  background-image: url("@{file-1x}");
22
23  @media
24  only screen and (-webkit-min-device-pixel-ratio: 2),
25  only screen and (   min--moz-device-pixel-ratio: 2),
26  only screen and (     -o-min-device-pixel-ratio: 2/1),
27  only screen and (        min-device-pixel-ratio: 2),
28  only screen and (                min-resolution: 192dpi),
29  only screen and (                min-resolution: 2dppx) {
30    background-image: url("@{file-2x}");
31    background-size: @width-1x @height-1x;
32  }
33}
Note: See TracBrowser for help on using the repository browser.