HTML and CSS Reference
In-Depth Information
Support
max/min Allowed Values
Media Query
Description
Example(s)
aspect-ratio The ratio of the width
to the height of the
media.
Yes
Integer/
Integer
@media screen
and (aspect-
ratio: 640/480)
{ ... }
Describes the number
of bits of color the
device supports,
or 0 if no color is
supported. A presence
value can be used to
simply see if color is
supported.
Yes
Integer
color
@media all and
(color) { ... }
@media all and
(min-color: 16)
{ ... }
color-index Describes number of
entries in the color
lookup table of the
output device or 0 if
color is not supported.
Yes
Integer
@media screen
and (color-
index: 256)
{ ... }
device-
aspect-ratio
The ratio of the device
width to the device
height of the media.
Yes
Integer/
Integer
@media screen
and (device-
aspect-ratio:
1024/768)
{ ... }
device-
height
Describes the height
of the screen or full
height of the output
page.
Yes
Typical CSS length units
like px , em , in , and
so on
@media screen
and (device-
height: 768px)
{ ... }
device-width Describes the width
of the screen or the
full width of the output
page.
Yes
Typical CSS length units
like px , em , in , and
so on
@media screen
and (device-
width: 1000px)
{ ... }
grid
Determines if output
is grid, like a simple
terminal or phone,
or bitmap, like a
standard monitor or
printer.
No
1 or 0 (no value
required presence
style value)
@media screen
and (grid) {...}
Describes the current
supported width of
the device's viewport
or paged media box
in the case of print
output.
Yes
Typical CSS length units
like px , em , in , and
so on
height
@media screen
and (height:
922px) { ... }
@media screen
and (max-height:
800px) and (min-
height: 400px)
{ ... }
T ABLE 6-6 CSS Media Query Values (continued)
 
Search WWH ::




Custom Search