Skip to content

Commit bf6b7cb

Browse files
committed
Add the resolution unit, since it's used in two specs (MQ and Images)
1 parent 226b29e commit bf6b7cb

2 files changed

Lines changed: 119 additions & 10 deletions

File tree

css3-values/Overview.html

Lines changed: 83 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -26,13 +26,14 @@
2626

2727
<h1>CSS Values and Units Module Level 3</h1>
2828

29-
<h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 5 January 2012</h2>
29+
<h2 class="no-num no-toc" id=longstatus-date>Editor's Draft 7 February
30+
2012</h2>
3031

3132
<dl>
3233
<dt>This version:
3334

3435
<dd><a
35-
href="http://www.w3.org/TR/2012/ED-css3-values-20120105/">http://www.w3.org/TR/2012/ED-css3-values-20120105/</a>
36+
href="http://www.w3.org/TR/2012/ED-css3-values-20120207/">http://www.w3.org/TR/2012/ED-css3-values-20120207/</a>
3637

3738
<dt>Latest version:
3839

@@ -254,11 +255,15 @@ <h2 class="no-num no-toc" id=contents>Table of contents</h2>
254255
class=css>s</code>&rsquo;, &lsquo;<code class=css>ms</code>&rsquo;
255256
units</a>
256257

257-
<li><a href="#frequencies-the-ltfrequencygt-type-and-h"><span
258-
class=secno>6.3. </span>Frequencies: the &lsquo;<code
259-
class=css>&lt;frequency&gt;</code>&rsquo; type and &lsquo;<code
260-
class=css>Hz</code>&rsquo;, &lsquo;<code class=css>kHz</code>&rsquo;
261-
units</a>
258+
<li><a href="#frequency"><span class=secno>6.3. </span> Frequencies: the
259+
&lsquo;<code class=css>&lt;frequency&gt;</code>&rsquo; type and
260+
&lsquo;<code class=css>Hz</code>&rsquo;, &lsquo;<code
261+
class=css>kHz</code>&rsquo; units</a>
262+
263+
<li><a href="#resolution"><span class=secno>6.4. </span> Resolutions:
264+
the &lsquo;<code class=css>dpi</code>&rsquo;, &lsquo;<code
265+
class=css>dpcm</code>&rsquo;, and &lsquo;<code
266+
class=css>dppx</code>&rsquo; units</a>
262267
</ul>
263268

264269
<li><a href="#defined-elsewhere"><span class=secno>7. </span> Data Types
@@ -1174,8 +1179,8 @@ <h3 id=time><span class=secno>6.2. </span> Times: the &lsquo;<a
11741179
outside the allowed range, the declaration is invalid and must be <a
11751180
href="http://www.w3.org/TR/CSS21/conform.html#ignore">ignored</a>.
11761181

1177-
<h3 id=frequencies-the-ltfrequencygt-type-and-h><span class=secno>6.3.
1178-
</span>Frequencies: the &lsquo;<a href="#frequency-value"><code
1182+
<h3 id=frequency><span class=secno>6.3. </span> Frequencies: the &lsquo;<a
1183+
href="#frequency-value"><code
11791184
class=css>&lt;frequency&gt;</code></a>&rsquo; type and &lsquo;<a
11801185
href="#hz"><code class=css>Hz</code></a>&rsquo;, &lsquo;<a
11811186
href="#khz"><code class=css>kHz</code></a>&rsquo; units</h3>
@@ -1197,6 +1202,56 @@ <h3 id=frequencies-the-ltfrequencygt-type-and-h><span class=secno>6.3.
11971202
<p>For example, when representing sound pitches, 200Hz (or 200hz) is a bass
11981203
sound, and 6kHz (or 6khz) is a treble sound.
11991204

1205+
<h3 id=resolution><span class=secno>6.4. </span> Resolutions: the &lsquo;<a
1206+
href="#dpi"><code class=css>dpi</code></a>&rsquo;, &lsquo;<a
1207+
href="#dpcm"><code class=css>dpcm</code></a>&rsquo;, and &lsquo;<a
1208+
href="#dppx"><code class=css>dppx</code></a>&rsquo; units</h3>
1209+
1210+
<p>Resolution units are <i>dimensions</i> denoted by <dfn
1211+
id=resolution-value>&lt;resolution></dfn>. The frequency unit identifiers
1212+
are:
1213+
1214+
<dl>
1215+
<dt><dfn id=dpi>dpi</dfn>
1216+
1217+
<dd>dots per inch
1218+
1219+
<dt><dfn id=dpcm>dpcm</dfn>
1220+
1221+
<dd>dots per centimeter
1222+
1223+
<dt><dfn id=dppx>dppx</dfn>
1224+
1225+
<dd>dots per &lsquo;<code class=css>px</code>&rsquo; unit
1226+
</dl>
1227+
1228+
<p>The &lsquo;<a href="#resolution-value"><code
1229+
class=css>&lt;resolution></code></a>&rsquo; unit represents the size of a
1230+
single "dot" in a graphical representation by indicating how many of these
1231+
dots fit in a CSS &lsquo;<code class=property>in</code>&rsquo;,
1232+
&lsquo;<code class=property>cm</code>&rsquo;, or &lsquo;<code
1233+
class=property>px</code>&rsquo;. For uses, see e.g. the &lsquo;<code
1234+
class=css>resolution</code>&rsquo; media query in <a href="#MEDIAQ"
1235+
rel=biblioentry>[MEDIAQ]<!--{{MEDIAQ}}--></a> or the &lsquo;<code
1236+
class=property>image-resolution</code>&rsquo; property defined in
1237+
[[CSS3IMAGES]].
1238+
1239+
<p class=note>Note that due to the 1:96 fixed ratio of CSS &lsquo;<code
1240+
class=css>in</code>&rsquo; to CSS &lsquo;<code class=css>px</code>&rsquo;,
1241+
&lsquo;<code class=css>1dppx</code>&rsquo; is equivalent to &lsquo;<code
1242+
class=css>96dpi</code>&rsquo;. This corresponds to the default resolution
1243+
of images displayed in CSS: see &lsquo;<code
1244+
class=property>image-resolution</code>&rsquo;.
1245+
1246+
<div class=example>
1247+
<p>The following @media rule uses Media Queries <a href="#MEDIAQ"
1248+
rel=biblioentry>[MEDIAQ]<!--{{MEDIAQ}}--></a> to assign some special
1249+
style rules to devices that use two or more device pixels per CSS
1250+
&lsquo;<code class=css>px</code>&rsquo; unit:
1251+
1252+
<pre>@media (min-resolution: 2dppx) { ... }</pre>
1253+
</div>
1254+
12001255
<h2 id=defined-elsewhere><span class=secno>7. </span> Data Types Defined
12011256
Elsewhere</h2>
12021257

@@ -1819,6 +1874,16 @@ <h3 class=no-num id=other-references>Other references</h3>
18191874
</dd>
18201875
<!---->
18211876

1877+
<dt id=MEDIAQ>[MEDIAQ]
1878+
1879+
<dd>H&#229;kon Wium Lie; et al. <a
1880+
href="http://www.w3.org/TR/2010/CR-css3-mediaqueries-20100727/"><cite>Media
1881+
Queries.</cite></a> 27 July 2010. W3C Candidate Recommendation. (Work in
1882+
progress.) URL: <a
1883+
href="http://www.w3.org/TR/2010/CR-css3-mediaqueries-20100727/">http://www.w3.org/TR/2010/CR-css3-mediaqueries-20100727/</a>
1884+
</dd>
1885+
<!---->
1886+
18221887
<dt id=URI>[URI]
18231888

18241889
<dd>T. Berners-Lee; R. Fielding; L. Masinter. <a
@@ -1859,6 +1924,12 @@ <h2 class=no-num id=index>Index</h2>
18591924
<li>dimension, <a href="#dimension"
18601925
title=dimension><strong>5.</strong></a>
18611926

1927+
<li>dpcm, <a href="#dpcm" title=dpcm><strong>6.4.</strong></a>
1928+
1929+
<li>dpi, <a href="#dpi" title=dpi><strong>6.4.</strong></a>
1930+
1931+
<li>dppx, <a href="#dppx" title=dppx><strong>6.4.</strong></a>
1932+
18621933
<li>em, <a href="#em-unit" title=em><strong>5.1.1.</strong></a>
18631934

18641935
<li>ex, <a href="#ex-unit" title=ex><strong>5.1.1.</strong></a>
@@ -1927,6 +1998,9 @@ <h2 class=no-num id=index>Index</h2>
19271998

19281999
<li>rem, <a href="#rem-unit" title=rem><strong>5.1.1.</strong></a>
19292000

2001+
<li>&lt;resolution>, <a href="#resolution-value"
2002+
title="&lt;resolution>"><strong>6.4.</strong></a>
2003+
19302004
<li>resolved type, <a href="#resolved-type"
19312005
title="resolved type"><strong>8.1.</strong></a>
19322006

css3-values/Overview.src.html

Lines changed: 36 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -775,7 +775,8 @@ <h3 id="time">
775775
If the value is outside the allowed range, the declaration is invalid
776776
and must be <a href="http://www.w3.org/TR/CSS21/conform.html#ignore">ignored</a>.
777777

778-
<h3>Frequencies: the ''&lt;frequency&gt;'' type and ''Hz'', ''kHz'' units</h3>
778+
<h3 id="frequency">
779+
Frequencies: the ''&lt;frequency&gt;'' type and ''Hz'', ''kHz'' units</h3>
779780

780781
<p>Frequency values are <i>dimensions</i> denoted by
781782
<dfn id="frequency-value">&lt;frequency&gt;</dfn>.
@@ -791,6 +792,40 @@ <h3>Frequencies: the ''&lt;frequency&gt;'' type and ''Hz'', ''kHz'' units</h3>
791792
<p>For example, when representing sound pitches, 200Hz (or 200hz)
792793
is a bass sound, and 6kHz (or 6khz) is a treble sound.</p>
793794

795+
<h3 id="resolution">
796+
Resolutions: the ''dpi'', ''dpcm'', and ''dppx'' units</h3>
797+
798+
<p>Resolution units are <i>dimensions</i> denoted by <dfn id="resolution-value">&lt;resolution></dfn>. The frequency unit identifiers are:</p>
799+
800+
<dl>
801+
<dt><dfn>dpi</dfn></dt>
802+
<dd>dots per inch</dd>
803+
804+
<dt><dfn>dpcm</dfn></dt>
805+
<dd>dots per centimeter</dd>
806+
807+
<dt><dfn>dppx</dfn></dt>
808+
<dd>dots per ''px'' unit</dd>
809+
</dl>
810+
811+
<p>The ''&lt;resolution>'' unit represents the size of a single "dot" in a
812+
graphical representation by indicating how many of these dots fit in a
813+
CSS 'in', 'cm', or 'px'.
814+
For uses, see e.g. the ''resolution'' media query in [[MEDIAQ]]
815+
or the 'image-resolution' property defined in [[CSS3IMAGES]].
816+
817+
<p class="note">Note that due to the 1:96 fixed ratio of CSS ''in'' to
818+
CSS ''px'', ''1dppx'' is equivalent to ''96dpi''. This corresponds to
819+
the default resolution of images displayed in CSS: see 'image-resolution'.
820+
821+
<div class="example">
822+
<p>The following @media rule uses Media Queries [[MEDIAQ]] to assign
823+
some special style rules to devices that use two or more device pixels
824+
per CSS ''px'' unit:
825+
<pre>@media (min-resolution: 2dppx) { ... }</pre>
826+
</div>
827+
828+
794829
<h2 id="defined-elsewhere">
795830
Data Types Defined Elsewhere</h2>
796831

0 commit comments

Comments
 (0)