3b74578cc9
Including double-nested queries which are used (not only) by bootstrap3. Triple-nested (or more) media queries are currently not supported. Added several tests. See http://www.lesscss.org/#-nested-media-queries
83 lines
1.2 KiB
CSS
83 lines
1.2 KiB
CSS
@media screen,projection {
|
|
html {
|
|
background: #fffef0;
|
|
color: #330000;
|
|
}
|
|
body {
|
|
max-width: 35em;
|
|
margin: 0 auto;
|
|
}
|
|
}
|
|
@media print {
|
|
.class {
|
|
color: blue;
|
|
}
|
|
.class .sub {
|
|
width: 42;
|
|
}
|
|
.top, header > h1 {
|
|
color: #444444;
|
|
}
|
|
}
|
|
@media screen {
|
|
body {
|
|
max-width: 480;
|
|
}
|
|
}
|
|
@media all and (orientation:portrait) {
|
|
aside {
|
|
float: none;
|
|
}
|
|
}
|
|
@media not screen and (color),print and (color) {
|
|
body {
|
|
margin: 0 auto;
|
|
}
|
|
}
|
|
@media (min-width:768px)and (max-width:979px) {
|
|
.hidden-desktop {
|
|
display: none !important;
|
|
}
|
|
}
|
|
@media (min-width:12px) {
|
|
body {
|
|
margin: 0 auto;
|
|
}
|
|
}
|
|
@media (width:767px) {
|
|
.visible-xs {
|
|
display: block;
|
|
}
|
|
}
|
|
@media only screen and (min--moz-device-pixel-ratio:2.5),only screen and (-o-min-device-pixel-ratio:2),only screen and (min-device-pixel-ratio:2),only screen and (min-resolution:192dpi),only screen and (min-resolution:2dppx) {
|
|
background-size: 10px;
|
|
}
|
|
@media (width:768px) {
|
|
.lead {
|
|
font-size: 21px;
|
|
}
|
|
}
|
|
@media (width:400px) {
|
|
.one {
|
|
font-size: 1.2em;
|
|
}
|
|
}
|
|
@media (width:400px) and print and (color) {
|
|
.one {
|
|
color: blue;
|
|
}
|
|
}
|
|
.two {
|
|
width: 100px;
|
|
}
|
|
@media (width:400px) {
|
|
.two {
|
|
font-size: 1.2em;
|
|
}
|
|
}
|
|
@media print and (color) {
|
|
.two {
|
|
color: blue;
|
|
}
|
|
}
|