You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1379 lines
44 KiB
1379 lines
44 KiB
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
|
|
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
|
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
|
|
<head>
|
|
<title>CSS TV Profile 1.0</title>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
|
|
<meta name="author" content="Sean Hayes" />
|
|
<meta name="author" content="Glenn Adams" />
|
|
<meta name="author" lang="tr" content="Tantek Çelik" />
|
|
<meta name="author" lang="no" content="Håkon Wium Lie" />
|
|
<meta name="keywords" content="CSS Cascading Style Sheets TV Television Profile" />
|
|
<meta http-equiv="Content-Style-Type" content="text/css" />
|
|
<style type="text/css">
|
|
th { background: #005A9C; color: white; }
|
|
tr.yes { background: aqua; }
|
|
tr.no { background: transparent; }
|
|
.ins,.del { background: yellow; }
|
|
.del { text-decoration: line-through; }
|
|
img.head { width:72px; height:48px }
|
|
</style>
|
|
<link rel="stylesheet" href="http://www.w3.org/StyleSheets/TR/W3C-CR.css" type="text/css" />
|
|
</head>
|
|
|
|
<body>
|
|
<div class="head">
|
|
<p><a href="http://www.w3.org/"><img class="head" src="http://www.w3.org/Icons/w3c_home" alt="W3C" width="72" height="48"/></a></p>
|
|
<h1 class="head">CSS TV Profile 1.0</h1>
|
|
<h2>W3C Candidate Recommendation 14 May 2003</h2>
|
|
<dl>
|
|
<dt>This version:</dt>
|
|
<dd><a href="http://www.w3.org/TR/2003/CR-css-tv-20030514">
|
|
http://www.w3.org/TR/2003/CR-css-tv-20030514</a></dd>
|
|
<dt>Latest version:</dt>
|
|
<dd><a href="http://www.w3.org/TR/css-tv">
|
|
http://www.w3.org/TR/css-tv</a></dd>
|
|
<dt>Previous version:</dt>
|
|
<dd><a href="http://www.w3.org/TR/2002/CR-css-tv-20020807">
|
|
http://www.w3.org/TR/2002/CR-css-tv-20020807</a></dd>
|
|
<dt>Authors:</dt>
|
|
<dd>Sean Hayes
|
|
(<a href="http://www.microsoft.com/">Microsoft</a>)
|
|
<<a href="mailto:shayes@microsoft.com">shayes@microsoft.com</a>></dd>
|
|
<dd>Glenn Adams
|
|
(invited expert, <a href="http://www.xfsi.com/">Extensible Formatting Systems Inc.</a>)
|
|
<<a href="mailto:glenn@xfsi.com">glenn@xfsi.com</a>></dd>
|
|
<dd><span lang="tr">Tantek Çelik</span>
|
|
(<a href="http://www.microsoft.com/">Microsoft</a>)
|
|
<<a href="mailto:tantekc@microsoft.com">tantekc@microsoft.com</a>></dd>
|
|
<dd><span lang="no">Håkon Wium Lie</span>
|
|
(<a href="http://www.opera.com/">Opera Software</a>)
|
|
<<a href="mailto:howcome@opera.com">howcome@opera.com</a>></dd>
|
|
</dl>
|
|
|
|
<p class="copyright"><a
|
|
href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright">
|
|
Copyright</a> © 2003 <a href="http://www.w3.org/"><abbr
|
|
title="World Wide Web Consortium">W3C</abbr></a><sup>®</sup> (<a
|
|
href="http://www.lcs.mit.edu/"><abbr title="Massachusetts Institute of
|
|
Technology">MIT</abbr></a>, <a
|
|
href="http://www.ercim.org/"><acronym title="European Research
|
|
Consortium for Informatics and Mathematics">ERCIM</acronym></a>, <a
|
|
href="http://www.keio.ac.jp/">Keio</a>), All Rights Reserved. W3C <a
|
|
href="http://www.w3.org/Consortium/Legal/ipr-notice#Legal_Disclaimer">liability</a>,
|
|
<a
|
|
href="http://www.w3.org/Consortium/Legal/ipr-notice#W3C_Trademarks">trademark</a>,
|
|
<a
|
|
href="http://www.w3.org/Consortium/Legal/copyright-documents">document
|
|
use</a> and <a
|
|
href="http://www.w3.org/Consortium/Legal/copyright-software">software
|
|
licensing</a> rules apply.</p>
|
|
|
|
<hr />
|
|
</div>
|
|
<h2 class="no-toc">Abstract</h2>
|
|
|
|
<p>This specification defines a subset of Cascading Style Sheets Level 2
|
|
and CSS3 Module: Color specifications tailored to the needs and constraints of TV devices.</p>
|
|
|
|
<!-- **************************** -->
|
|
<!-- STATUS of DOCUMENT -->
|
|
<!-- **************************** -->
|
|
|
|
<h2 id="status">Status of This Document</h2>
|
|
|
|
<p><em>This section describes the status of this document at the time
|
|
of its publication. Other documents may supersede this document. The
|
|
latest status of this document series is maintained at the
|
|
W3C.</em></p>
|
|
|
|
<p>This specification is being put forth as a
|
|
<a href="http://www.w3.org/TR/#About">W3C Candidate Recommendation</a>
|
|
by the <a href="http://www.w3.org/Style/Group">CSS Working Group</a>
|
|
(part of the <a href="http://www.w3.org/Style/">Style Activity</a>, see <a
|
|
href="/Style/Activity">summary</a>). This document is an editorial revision of the <a href="http://www.w3.org/TR/2002/CR-css-tv-20020807">Candidate Recommendation dated 2002-08-07</a> and has incorporated editorial suggestions made after publication of the previous Candidate Recommendation draft, in addition to updating the supported values for the 'opacity' property in sync with the CSS3 Module: Color Candidate Recommendation draft. The previous draft of this specification, the <a href="http://www.w3.org/TR/2002/CR-css-tv-20020807">Candidate Recommendation dated 2002-08-07</a>, was a revision of
|
|
the <a href="http://www.w3.org/TR/2002/WD-css-tv-20020515">Last Call Working Draft dated 2002-05-15</a>, and incorporated suggestions received during Last Call review, comments by implementors, and further deliberations of the W3C CSS Working Group.
|
|
</p>
|
|
<p>All persons are encouraged to review and implement this
|
|
specification and return comments to the (<a href=
|
|
"http://lists.w3.org/Archives/Public/www-style/">archived</a>) public
|
|
mailing list <a href=
|
|
"mailto:www-style@w3.org">www-style</a> (see <a
|
|
href="http://www.w3.org/Mail/Request">instructions</a>). W3C Members
|
|
can also send comments directly to the CSS Working Group.</p>
|
|
|
|
<div id="exitcrit">
|
|
<p>For this specification to exit the CR stage, the following conditions shall be met:</p>
|
|
<ol>
|
|
<li><p> There must be at least two interoperable implementations implementing 'all' the features in the TV Profile.
|
|
An implementation can implement a superset of the features and claim conformance to the
|
|
profile. For the purposes of this criterion, we define the following terms:</p>
|
|
<dl><dt>feature</dt><dd><p>a row in the tables of section 3 and section 4 that has not been marked 'No' in the CSS TV column.</p></dd>
|
|
<dt>interoperable</dt><dd><p>passing the respective test case(s) in the CSS test suite, or, if the implementation is not a web browser, an equivalent test. Every relevant test in the test suite should have an equivalent test created if such a user agent (UA) is to be used to claim interoperability. In addition if such a UA is to be used to claim interoperability, then there must one or more additional UAs which can also pass those equivalent tests in the same way for the purpose of interoperability. The equivalent tests must be made publicly available for the purposes of peer review.
|
|
</p></dd>
|
|
<dt>implementation</dt><dd><p>a user agent which:</p>
|
|
<ol>
|
|
<li>implements the feature.</li>
|
|
<li>is available (i.e. publicly downloadable or available
|
|
through some other public point of sale mechanism). This is
|
|
the "show me" requirement.</li>
|
|
<li>is shipping (i.e. development, private or unofficial
|
|
versions are insufficient).</li>
|
|
<li>is not experimental (i.e. is intended for a wide audience
|
|
and could be used on a daily basis.)</li></ol></dd></dl> </li>
|
|
<li> <p style="margin-top: 1em"> A minimum of sixth months of the CR period must have elapsed.
|
|
This is to ensure that enough time is given for any remaining
|
|
major errors to be caught. </p>
|
|
</li></ol>
|
|
</div>
|
|
|
|
<p>The CSS Working Group believes this document addresses all last call comments,
|
|
and can be considered stable. It can still be updated
|
|
by the Working Group, but only to clarify its meaning. If,
|
|
unexpectedly, serious problems are found, it will be returned to
|
|
Working Draft status. The duration of the original six month Candidate Recommendation phase (August 2002 - January 2003) has already passed. Therefore, as soon as the exit criteria are met, it will progress to Proposed Recommendation.</p>
|
|
|
|
<p>Patent disclosures relevant to CSS may be found on the Working
|
|
Group's public <a href="/Style/CSS/Disclosures">patent disclosure
|
|
page.</a></p>
|
|
|
|
<p>A list of current W3C Recommendations and other technical documents
|
|
can be found at <a href="http://www.w3.org/TR/">http://www.w3.org/TR</a>.</p>
|
|
|
|
<!-- *************************** -->
|
|
<!-- TABLE OF CONTENTS -->
|
|
<!-- *************************** -->
|
|
|
|
<h2 class="no-toc" id="toc">Contents</h2>
|
|
|
|
<div class="contents">
|
|
<ul class="toc">
|
|
<li class="tocline">1. <a href="#section-overview">Overview</a></li>
|
|
<li class="tocline">2. <a href="#section-conformance">Conformance</a></li>
|
|
<li class="tocline">3. <a href="#section-selectors">Selectors and at-rules</a></li>
|
|
<li class="tocline">4. <a href="#section-properties">Properties</a></li>
|
|
<li class="tocline">5. <a href="#section-syntax">Syntax</a></li>
|
|
<li class="tocline">6. <a href="#section-assigning">Assigning Property Values, Cascading, and Inheritance</a></li>
|
|
<li class="tocline">7. <a href="#section-mediatypes">Media Types</a></li>
|
|
<li class="tocline">8. <a href="#section-ack">Acknowledgements</a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- ****************** -->
|
|
<!-- OVERVIEW -->
|
|
<!-- ****************** -->
|
|
|
|
|
|
<h2 id="section-overview">1. Overview</h2>
|
|
|
|
<p>This document specifies a profile of the Cascading Style Sheets level 2 (CSS2) and CSS3 Module: Color specifications appropriate for TV devices such as set top boxes or integrated interactive television sets that display their output on a television screen. Conformance to this profile means that a user agent supports, at minimum, the features defined in this specification. This subject is addressed in <a href="#section-conformance">Section 2, Conformance,</a> below.
|
|
</p>
|
|
|
|
<p>As defined in [<a href="#ref-css2">CSS2</a>]:</p>
|
|
|
|
<blockquote>
|
|
<p>CSS2 is a style sheet language that allows authors and users to attach style (e.g., fonts, spacing, and aural cues) to structured documents (e.g., HTML documents and XML applications). By separating the presentation style of documents from the content of documents, CSS2 simplifies Web authoring and site maintenance. CSS2 builds on CSS1 (see [<a href="#ref-css1">CSS1</a>]) and, with very few exceptions, all valid
|
|
CSS1 style sheets are valid CSS2 style sheets. CSS2 supports media-specific style sheets so that authors may tailor the presentation of their documents to visual browsers, aural devices, printers, braille devices, handheld devices, etc.</p>
|
|
</blockquote>
|
|
|
|
<p>In summary, CSS2 specifies how developers can author style sheets for presenting documents across multiple devices and media types. While this is very important, it is also important that authors have an understanding of what features are supported on these different devices. Likewise, it is important that similar devices operate in a similar manner. Otherwise, authors will need to develop style sheets for each version of each device -- raising the cost of content development and decreasing interoperability.</p>
|
|
|
|
<p>The CSS TV Profile specifies a conformance profile for TV devices, identifying a minimum set of properties, values, selectors, and cascading rules. The resulting CSS TV Profile includes the vast majority of CSS1, portions of CSS2 and CSS3 Module: Color. The CSS TV Profile is a proper superset of the CSS Mobile Profile, with the use of the 'tv' media type instead of the 'handheld' media type.</p>
|
|
|
|
<!-- ******************** -->
|
|
<!-- CONFORMANCE -->
|
|
<!-- ******************** -->
|
|
|
|
<h2 id="section-conformance">2. Conformance</h2>
|
|
|
|
<p>The primary role of a profile is to define a subset of features that provides a minimal guarantee of interoperability. In the case of the CSS TV Profile, this guarantee is that a conforming user agent will support the features defined in this specification following the CSS2 conformance clause ([<a href="#ref-css2">CSS2</a>] Section 3.2), recast and summarized below:</p>
|
|
|
|
<ol>
|
|
<li>A CSS TV Profile conforming user agent (TV-UA) MUST support the <em>all</em> and <em>tv</em> CSS2 media types. A TV-UA MAY support other CSS2 media types, as well.</li>
|
|
<li>For each source document, a TV-UA MUST attempt to retrieve all associated style sheets that are appropriate for the supported media types.</li>
|
|
<li>A TV-UA MUST parse the style sheets according to this specification. In particular, the TV-UA MUST recognize all CSS TV Profile at-rules, blocks, declarations, and selectors. If a TV-UA encounters a property that applies for a supported media type, the TV-UA MUST parse the value according to the property definition. This means that the TV-UA MUST accept all valid values and MUST ignore declarations with invalid values. TV-UA MUST ignore rules that apply to unsupported media types.</li>
|
|
<li>For each element in a document tree, the TV-UA MUST assign a value for every applicable property according to the property's definition and the rules of cascading and inheritance.</li>
|
|
<li>If the source document comes with alternate style sheets (such as with the "alternate" keyword in HTML 4.01 [HTML401]), the TV-UA SHOULD allow the user to select one from among these style sheets and apply the selected one.</li>
|
|
</ol>
|
|
|
|
<p>As with CSS2, there are qualifications to this conformance clause:</p>
|
|
|
|
<ol>
|
|
<li>Values MAY be approximated when required by the TV-UA.</li>
|
|
<li>The inability of a TV-UA to implement part of this specification due to the limitations of a particular device (e.g., a TV-UA cannot render colors on a monochrome monitor or page) SHALL NOT imply non-conformance.</li>
|
|
</ol>
|
|
|
|
<p>It is recommended that authors use this conformance profile to take advantage of forward compatibility. Authors should be able to use style properties with an understanding that the cascading rules are processed correctly and that unknown properties and values are ignored. For example:</p>
|
|
|
|
<div class="code-example">
|
|
<pre>
|
|
h3 {
|
|
display: inline;
|
|
display: run-in;
|
|
}
|
|
</pre>
|
|
</div>
|
|
|
|
<p>A TV-UA that can process the 'run-in' value for the 'display' property will
|
|
accept the first display declaration and then "write over" that value with
|
|
the second display declaration. A TV-UA that cannot process the 'run-in' value
|
|
will process the first display specification and ignore the second
|
|
display specification.</p>
|
|
|
|
<!-- ******************* -->
|
|
<!-- SELECTORS -->
|
|
<!-- ******************* -->
|
|
|
|
<h2 id="section-selectors">3. Selectors and at-rules</h2>
|
|
|
|
<h3 id="selectors">Selectors</h3>
|
|
|
|
<p>
|
|
In CSS2, pattern matching rules determine which style rules apply to elements
|
|
in the document tree [<a href="#ref-css2">CSS2</a>].
|
|
</p>
|
|
|
|
<p>The following table summarizes CSS TV Profile selector syntax.
|
|
In addition to these selectors, the CSS TV Profile includes the
|
|
CSS2 grouping mechanism (See [<a href="#ref-css2">CSS2</a>] Section 5.2.1).</p>
|
|
|
|
<div class="note"><p>
|
|
<em><strong>Note.</strong>
|
|
Unsupported selectors are parsed as invalid (which would affect valid selectors in the same group),
|
|
the same as if a purely CSS1 UA were to encounter selectors new in CSS2.
|
|
Of course a TV-UA is free to implement more selectors than required by CSS TV.
|
|
</em></p>
|
|
</div>
|
|
|
|
<table border="1" width="80%">
|
|
<tr>
|
|
<th>Pattern</th>
|
|
<th>Meaning</th>
|
|
<th>Selector type</th>
|
|
<th>CSS TV</th>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>*</td>
|
|
<td>Matches any element</td>
|
|
<td>Universal selector</td>
|
|
<td>Yes</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>E</td>
|
|
<td>Matches any E element (i.e., and element of type E)</td>
|
|
<td>Type selectors</td>
|
|
<td>Yes</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>E F</td>
|
|
<td>Matches any F element that is a descendent of an E element</td>
|
|
<td>Descendent selectors</td>
|
|
<td>Yes</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>E > F</td>
|
|
<td>Matches any F element that is a child of an element E</td>
|
|
<td>Child selectors</td>
|
|
<td>Yes</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>E:first-child</td>
|
|
<td>Matches element E when it is the first child of its parent</td>
|
|
<td>The :first-child pseudo-class</td>
|
|
<td>Yes</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>E:link<br />E:visited</td>
|
|
<td>Matches element E if E is the source anchor of a hyperlink of which the target is not yet visited (:link) or already visited (:visited).</td>
|
|
<td>The link pseudo-classes</td>
|
|
<td>Yes</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>E:active</td>
|
|
<td>Matches E during certain user actions.</td>
|
|
<td>The dynamic pseudo-classes</td>
|
|
<td>Yes</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>E:hover</td>
|
|
<td>Matches E during certain user actions.</td>
|
|
<td>The dynamic pseudo-classes</td>
|
|
<td>No</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>E:focus</td>
|
|
<td>Matches E during certain user actions.</td>
|
|
<td>The dynamic pseudo-classes</td>
|
|
<td>Yes</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>E:lang(c)</td>
|
|
<td>Matches element of type E if it is in (human) language c (the document language specifies how language is determined).</td>
|
|
<td>The :lang() pseudo-class</td>
|
|
<td>No</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>E + F</td>
|
|
<td>Matches any F element immediately preceded by an element E.</td>
|
|
<td>Adjacent selectors</td>
|
|
<td>No</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>E[foo]</td>
|
|
<td>Matches any E element with the "foo" attribute set (whatever the value).</td>
|
|
<td>Attribute selectors</td>
|
|
<td>No</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>E[foo="bar"]</td>
|
|
<td>Matches any E element whose "foo" attribute value is exactly equal to "bar".</td>
|
|
<td>Attribute selectors</td>
|
|
<td>No</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>E[foo~="bar"]</td>
|
|
<td>Matches any E element whose "foo" attribute value is a list of space-separated values, one of which is exactly equal to "bar".</td>
|
|
<td>Attribute selectors</td>
|
|
<td>No</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>E[foo|="bar"]</td>
|
|
<td>Matches any E element whose "foo" attribute value has a hyphen-separated list of values beginning (from the left) with "bar".</td>
|
|
<td>Attribute selectors</td>
|
|
<td>No</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>E:first-line</td>
|
|
<td>Matches the first formatted line of an E element.</td>
|
|
<td>The :first-line pseudo-element</td>
|
|
<td>Yes</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>E:first-letter</td>
|
|
<td>Matches the first formatted letter of an E element.</td>
|
|
<td>The :first-letter pseudo-element</td>
|
|
<td>Yes</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>E:before</td>
|
|
<td>Matches/creates generated content before an E element.</td>
|
|
<td>The :before pseudo-element</td>
|
|
<td>No</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>E:after</td>
|
|
<td>Matches/creates generated content after an E element.</td>
|
|
<td>The :after pseudo-element</td>
|
|
<td>No</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>E.bar</td>
|
|
<td>Matches any E element whose class attribute (as defined by the document language) value is a list of space-separated values, one of which is exactly equal to "bar".</td>
|
|
<td>Class selectors</td>
|
|
<td>Yes</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>E#bar</td>
|
|
<td>Matches any E element whose ID attribute (as defined by the document language) is equal to "bar".</td>
|
|
<td>ID selectors</td>
|
|
<td>Yes</td>
|
|
</tr>
|
|
|
|
</table>
|
|
|
|
<h3 id="at-rules">at-rules</h3>
|
|
|
|
<p>The following table summarizes CSS TV Profile at-rule syntax.</p>
|
|
|
|
<table border="1" width="80%">
|
|
<tr>
|
|
<th>at-rule</th>
|
|
<th>Function</th>
|
|
<th>CSS TV</th>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>@import</td>
|
|
<td>Imports an external style sheet.</td>
|
|
<td>Yes</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>@charset</td>
|
|
<td>Defines character set for the style sheet.</td>
|
|
<td>Yes</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>@media</td>
|
|
<td>Groups a set of style rules to apply only to one or more particular media.</td>
|
|
<td>Yes</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>@font-face</td>
|
|
<td>Defines a named font-family, including for downloading.</td>
|
|
<td>No</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>@page</td>
|
|
<td>Defines a (optionally named) page formatting context.</td>
|
|
<td>No</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>@color-profile</td>
|
|
<td>Defines a named color-profile.</td>
|
|
<td>No</td>
|
|
</tr>
|
|
|
|
</table>
|
|
|
|
|
|
<!-- ******************************* -->
|
|
<!-- PROPERTIES AND VALUES -->
|
|
<!-- ******************************* -->
|
|
|
|
|
|
<h2 id="section-properties">4. Properties</h2>
|
|
|
|
<p>The following table summarizes CSS TV Profile properties and property values from CSS2. Refer to [<a href="#ref-css2">CSS2</a>] for the definition of these properties and values.</p>
|
|
|
|
<table border="1" width="80%">
|
|
<thead>
|
|
<tr align="center">
|
|
<th>Name</th>
|
|
<th>CSS TV</th>
|
|
<th>CSS Values</th>
|
|
<th>Initial value</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr class="no">
|
|
<td>'azimuth'</td>
|
|
<td>No</td>
|
|
<td><angle> | [ left-side | far-left | left | center-left | center | center-right | right | far-right | right-side ] || behind ] | leftwards | rightwards | inherit </td>
|
|
<td>center</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'background'</td>
|
|
<td>['background-color' || 'background-image' || 'background-repeat' || 'background-position'] | inherit</td>
|
|
<td>['background-color' || 'background-image' || 'background-repeat' || 'background-attachment' || 'background-position'] | inherit</td>
|
|
<td>see individual properties</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'background-attachment'</td>
|
|
<td>No</td>
|
|
<td>scroll | fixed | inherit</td>
|
|
<td>scroll</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'background-color'</td>
|
|
<td>Yes</td>
|
|
<td><color> | transparent | inherit</td>
|
|
<td>transparent</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'background-image'</td>
|
|
<td>Yes</td>
|
|
<td><uri> | none | inherit</td>
|
|
<td>none</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'background-position'</td>
|
|
<td>Yes</td>
|
|
<td>[ [ <percentage> | <length> ]{1,2} | [ [top | center | bottom] || [left | center | right] ] ] | inherit</td>
|
|
<td>0% 0%</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'background-repeat'</td>
|
|
<td>Yes</td>
|
|
<td>repeat | repeat-x | repeat-y | no-repeat | inherit</td>
|
|
<td>repeat</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'border'</td>
|
|
<td>Yes</td>
|
|
<td>[ <border-width> || <border-style> || <border-color> ] | inherit</td>
|
|
<td>see individual properties</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'border-collapse'</td>
|
|
<td>No</td>
|
|
<td>collapse | separate | inherit</td>
|
|
<td>separate</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'border-color'</td>
|
|
<td>Yes</td>
|
|
<td><color>{1,4} | transparent | inherit</td>
|
|
<td>see individual properties</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'border-spacing'</td>
|
|
<td>No</td>
|
|
<td><length> <length>? | inherit</td>
|
|
<td>0</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'border-style'</td>
|
|
<td>Yes</td>
|
|
<td><border-style>{1,4} | inherit</td>
|
|
<td>see individual properties</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'border-top' 'border-right' 'border-bottom' 'border-left'</td>
|
|
<td>Yes</td>
|
|
<td>[ <border-width> || <border-style> || <border-color> ] | inherit</td>
|
|
<td>see individual properties</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'border-top-color' 'border-right-color' 'border-bottom-color' 'border-left-color'</td>
|
|
<td>Yes</td>
|
|
<td><color> | transparent | inherit</td>
|
|
<td>the value of the 'color' property</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'border-top-style' 'border-right-style' 'border-bottom-style' 'border-left-style'</td>
|
|
<td>Yes</td>
|
|
<td><border-style> | inherit</td>
|
|
<td>none</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'border-top-width' 'border-right-width' 'border-bottom-width' 'border-left-width'</td>
|
|
<td>Yes</td>
|
|
<td><border-width> | inherit</td>
|
|
<td>medium</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'border-width'</td>
|
|
<td>Yes</td>
|
|
<td><border-width>{1,4} | inherit</td>
|
|
<td>see individual properties</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'bottom'</td>
|
|
<td>Yes</td>
|
|
<td><length> | <percentage> | auto | inherit</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'caption-side'</td>
|
|
<td>Yes</td>
|
|
<td>top | bottom | left | right | inherit</td>
|
|
<td>top</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'clear'</td>
|
|
<td>Yes</td>
|
|
<td>none | left | right | both | inherit</td>
|
|
<td>none</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'clip'</td>
|
|
<td>Yes</td>
|
|
<td><shape> | auto | inherit</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'color'</td>
|
|
<td>Yes</td>
|
|
<td><color> | inherit</td>
|
|
<td>depends on user agent</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'content'</td>
|
|
<td>No</td>
|
|
<td>[ <string> | <uri> | <counter> | attr(X) | open-quote | close-quote | no-open-quote | no-close-quote ]+ | inherit</td>
|
|
<td>empty string</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'counter-increment'</td>
|
|
<td>No</td>
|
|
<td>[ <identifier> <integer>? ]+ | none | inherit</td>
|
|
<td>none</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'counter-reset'</td>
|
|
<td>No</td>
|
|
<td>[ <identifier> <integer>? ]+ | none | inherit</td>
|
|
<td>none</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'cue'</td>
|
|
<td>No</td>
|
|
<td>[ 'cue-before' || 'cue-after' ] | inherit</td>
|
|
<td>see individual properties</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'cue-after'</td>
|
|
<td>No</td>
|
|
<td><uri> | none | inherit</td>
|
|
<td>none</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'cue-before'</td>
|
|
<td>No</td>
|
|
<td><uri> | none | inherit</td>
|
|
<td>none</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'cursor'</td>
|
|
<td>No</td>
|
|
<td>[ [<uri> ,]* [ auto | crosshair | default | pointer | move | e-resize | ne-resize | nw-resize | n-resize | se-resize | sw-resize | s-resize | w-resize| text | wait | help ] ] | inherit</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'direction'</td>
|
|
<td>No</td>
|
|
<td>ltr | rtl | inherit</td>
|
|
<td>ltr</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'display'</td>
|
|
<td>inline | block | list-item | none | inherit</td>
|
|
<td>inline | block | list-item | run-in | compact | marker | table | inline-table | table-row-group | table-header-group | table-footer-group | table-row | table-column-group | table-column | table-cell | table-caption | none | inherit</td>
|
|
<td>inline</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'elevation'</td>
|
|
<td>No</td>
|
|
<td><angle> | below | level | above | higher | lower | inherit</td>
|
|
<td>level</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'empty-cells'</td>
|
|
<td>No</td>
|
|
<td>show | hide | inherit</td>
|
|
<td>show</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'float'</td>
|
|
<td>Yes</td>
|
|
<td>left | right | none | inherit</td>
|
|
<td>none</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'font'</td>
|
|
<td>Yes</td>
|
|
<td>[ [ 'font-style' || 'font-variant' || 'font-weight' ]? 'font-size' [ / 'line-height' ]? 'font-family' ] | caption | icon | menu | message-box | small-caption | status-bar | inherit</td>
|
|
<td>see individual properties</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'font-family'</td>
|
|
<td>Yes</td>
|
|
<td>[[ <family-name> | <generic-family> ],]* [ <family-name> | <generic-family> ] | inherit</td>
|
|
<td>depends on user agent</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'font-size'</td>
|
|
<td>Yes</td>
|
|
<td><absolute-size> | <relative-size> | <length> | <percentage> | inherit</td>
|
|
<td>medium</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'font-size-adjust'</td>
|
|
<td>No</td>
|
|
<td><number> | none | inherit</td>
|
|
<td>none</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'font-stretch'</td>
|
|
<td>No</td>
|
|
<td>normal | wider | narrower | ultra-condensed | extra-condensed | condensed | semi-condensed | semi-expanded | expanded | extra-expanded | ultra-expanded | inherit</td>
|
|
<td>normal</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'font-style'</td>
|
|
<td>Yes</td>
|
|
<td>normal | italic | oblique | inherit</td>
|
|
<td>normal</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'font-variant'</td>
|
|
<td>Yes</td>
|
|
<td>normal | small-caps | inherit</td>
|
|
<td>normal</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'font-weight'</td>
|
|
<td>Yes</td>
|
|
<td>normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | inherit</td>
|
|
<td>normal</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'height'</td>
|
|
<td>Yes</td>
|
|
<td><length> | <percentage> | auto | inherit</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'left'</td>
|
|
<td>Yes</td>
|
|
<td><length> | <percentage> | auto | inherit</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'letter-spacing'</td>
|
|
<td>No</td>
|
|
<td>normal | <length> | inherit</td>
|
|
<td>normal</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'line-height'</td>
|
|
<td>Yes</td>
|
|
<td>normal | <number> | <length> | <percentage> | inherit</td>
|
|
<td>normal</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'list-style'</td>
|
|
<td>Yes</td>
|
|
<td>[ 'list-style-type' || 'list-style-position' || 'list-style-image' ] | inherit</td>
|
|
<td>see individual properties</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'list-style-image'</td>
|
|
<td>Yes</td>
|
|
<td><uri> | none | inherit</td>
|
|
<td>none</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'list-style-position'</td>
|
|
<td>Yes</td>
|
|
<td>inside | outside | inherit</td>
|
|
<td>outside</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'list-style-type'</td>
|
|
<td>disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | lower-latin | upper-alpha | upper-latin | none | inherit</td>
|
|
<td>disc | circle | square | decimal | decimal-leading-zero | lower-roman | upper-roman | lower-greek | lower-alpha | lower-latin | upper-alpha | upper-latin | hebrew | armenian | georgian | cjk-ideographic | hiragana | katakana | hiragana-iroha | katakana-iroha | none | inherit</td>
|
|
<td>disc</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'margin'</td>
|
|
<td>Yes</td>
|
|
<td><margin-width>{1,4} | inherit</td>
|
|
<td>see individual properties</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'margin-top' 'margin-right' 'margin-bottom' 'margin-left'</td>
|
|
<td>Yes</td>
|
|
<td><margin-width> | inherit</td>
|
|
<td>0</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'marker-offset'</td>
|
|
<td>No</td>
|
|
<td><length> | auto | inherit</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'marks'</td>
|
|
<td>No</td>
|
|
<td>[ crop || cross ] | none | inherit</td>
|
|
<td>none</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'max-height'</td>
|
|
<td>No</td>
|
|
<td><length> | <percentage> | none | inherit</td>
|
|
<td>none</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'max-width'</td>
|
|
<td>No</td>
|
|
<td><length> | <percentage> | none | inherit</td>
|
|
<td>none</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'min-height'</td>
|
|
<td>No</td>
|
|
<td><length> | <percentage> | inherit</td>
|
|
<td>0</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'min-width'</td>
|
|
<td>No</td>
|
|
<td><length> | <percentage> | inherit</td>
|
|
<td>depends on user agent</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'orphans'</td>
|
|
<td>No</td>
|
|
<td><integer> | inherit</td>
|
|
<td>2</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'outline'</td>
|
|
<td>Yes</td>
|
|
<td>[ 'outline-color' || 'outline-style' || 'outline-width' ] | inherit</td>
|
|
<td>see individual properties</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'outline-color'</td>
|
|
<td>Yes</td>
|
|
<td><color> | invert | inherit</td>
|
|
<td>invert</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'outline-style'</td>
|
|
<td>Yes</td>
|
|
<td><border-style> | inherit</td>
|
|
<td>none</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'outline-width'</td>
|
|
<td>Yes</td>
|
|
<td><border-width> | inherit</td>
|
|
<td>medium</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'overflow'</td>
|
|
<td>No</td>
|
|
<td>visible | hidden | scroll | auto | inherit</td>
|
|
<td>visible</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'padding'</td>
|
|
<td>Yes</td>
|
|
<td><padding-width>{1,4} | inherit</td>
|
|
<td>see individual properties</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'padding-top' 'padding-right' 'padding-bottom' 'padding-left'</td>
|
|
<td>Yes</td>
|
|
<td><padding-width> | inherit</td>
|
|
<td>0</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'page'</td>
|
|
<td>No</td>
|
|
<td><identifier> | auto</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'page-break-after'</td>
|
|
<td>No</td>
|
|
<td>auto | always | avoid | left | right | inherit</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'page-break-before'</td>
|
|
<td>No</td>
|
|
<td>auto | always | avoid | left | right | inherit</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'page-break-inside'</td>
|
|
<td>No</td>
|
|
<td>avoid | auto | inherit</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'pause'</td>
|
|
<td>No</td>
|
|
<td>[ [<time> | <percentage>]{1,2} ] | inherit</td>
|
|
<td>depends on user agent</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'pause-after'</td>
|
|
<td>No</td>
|
|
<td><time> | <percentage> | inherit</td>
|
|
<td>depends on user agent</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'pause-before'</td>
|
|
<td>No</td>
|
|
<td><time> | <percentage> | inherit</td>
|
|
<td>depends on user agent</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'pitch'</td>
|
|
<td>No</td>
|
|
<td><frequency> | x-low | low | medium | high | x-high | inherit</td>
|
|
<td>medium</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'pitch-range'</td>
|
|
<td>No</td>
|
|
<td><number> | inherit</td>
|
|
<td>50</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'play-during'</td>
|
|
<td>No</td>
|
|
<td><uri> mix? repeat? | auto | none | inherit</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'position'</td>
|
|
<td>static | relative | absolute | inherit</td>
|
|
<td>static | relative | absolute | fixed | inherit</td>
|
|
<td>static</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'quotes'</td>
|
|
<td>No</td>
|
|
<td>[ <string><string>]+ | none | inherit</td>
|
|
<td>depends on user agent</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'richness'</td>
|
|
<td>No</td>
|
|
<td><number> | inherit</td>
|
|
<td>50</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'right'</td>
|
|
<td>Yes</td>
|
|
<td><length> | <percentage> | auto | inherit</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'size'</td>
|
|
<td>No</td>
|
|
<td><length>{1,2} | auto | portrait | landscape | inherit</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'speak'</td>
|
|
<td>No</td>
|
|
<td>normal | none | spell-out | inherit</td>
|
|
<td>normal</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'speak-header'</td>
|
|
<td>No</td>
|
|
<td>once | always | inherit</td>
|
|
<td>once</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'speak-numeral'</td>
|
|
<td>No</td>
|
|
<td>digits | continuous | inherit</td>
|
|
<td>continuous</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'speak-punctuation'</td>
|
|
<td>No</td>
|
|
<td>code | none | inherit</td>
|
|
<td>none</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'speech-rate'</td>
|
|
<td>No</td>
|
|
<td><number> | x-slow | slow | medium | fast | x-fast | faster | slower | inherit</td>
|
|
<td>medium</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'stress'</td>
|
|
<td>No</td>
|
|
<td><number> | inherit</td>
|
|
<td>50</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'table-layout'</td>
|
|
<td>No</td>
|
|
<td>auto | fixed | inherit</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'text-align'</td>
|
|
<td>left | right | center | justify | inherit</td>
|
|
<td>left | right | center | justify | <string> | inherit</td>
|
|
<td>depends on user agent and writing direction</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'text-decoration'</td>
|
|
<td>none | [ underline || overline || line-through ] | inherit</td>
|
|
<td>none | [ underline || overline || line-through || blink ] | inherit</td>
|
|
<td>none</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'text-indent'</td>
|
|
<td>Yes</td>
|
|
<td><length> | <percentage> | inherit</td>
|
|
<td>0</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'text-shadow'</td>
|
|
<td>No</td>
|
|
<td>none | [<color> || <length> <length> <length>? ,]* [ <color> || <length> <length> <length>?] | inherit</td>
|
|
<td>none</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'text-transform'</td>
|
|
<td>Yes</td>
|
|
<td>capitalize | uppercase | lowercase | none | inherit</td>
|
|
<td>none</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'top'</td>
|
|
<td>Yes</td>
|
|
<td><length> | <percentage> | auto | inherit</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'unicode-bidi'</td>
|
|
<td>No</td>
|
|
<td>normal | embed | bidi-override | inherit</td>
|
|
<td>normal</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'vertical-align'</td>
|
|
<td>baseline | sub | super | top | middle | bottom | inherit</td>
|
|
<td>baseline | sub | super | top | text-top | middle | bottom | text-bottom | <percentage> | <length> | inherit</td>
|
|
<td>baseline</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'visibility'</td>
|
|
<td>Yes</td>
|
|
<td>visible | hidden | collapse | inherit</td>
|
|
<td>inherit</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'voice-family'</td>
|
|
<td>No</td>
|
|
<td>[[ <specific-voice> | <generic-voice> ],]* [ <specific-voice> | <generic-voice> ] | inherit</td>
|
|
<td>depends on user agent</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'volume'</td>
|
|
<td>No</td>
|
|
<td><number> | <percentage> | silent | x-soft | soft | medium | loud | x-loud | inherit</td>
|
|
<td>medium</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'white-space'</td>
|
|
<td>Yes</td>
|
|
<td>normal | pre | nowrap | inherit</td>
|
|
<td>normal</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'widows'</td>
|
|
<td>No</td>
|
|
<td><integer> | inherit</td>
|
|
<td>2</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'width'</td>
|
|
<td>Yes.
|
|
Note that a TV UA may implement a UA style sheet rule of <code>*{max-width: 100%}</code> to avoid horizontal scrolling.</td>
|
|
<td><length> | <percentage> | auto | inherit</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
|
|
<tr class="no">
|
|
<td>'word-spacing'</td>
|
|
<td>No</td>
|
|
<td>normal | <length> | inherit</td>
|
|
<td>normal</td>
|
|
</tr>
|
|
|
|
<tr class="yes">
|
|
<td>'z-index'</td>
|
|
<td>Yes</td>
|
|
<td>auto | <integer> | inherit</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
<p>The following table summarizes CSS TV Profile properties and property values from the CSS3 Module: Color. Refer to [<a href="#ref-css3color">CSS3COLOR</a>] for the definition of these properties and values.</p>
|
|
|
|
<table border="1" width="80%">
|
|
<thead>
|
|
<tr align="center">
|
|
<th>Name</th>
|
|
<th>CSS TV</th>
|
|
<th>CSS Values</th>
|
|
<th>Initial value</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr class="yes">
|
|
<td>'color'</td>
|
|
<td>HTML4 keywords, RGB and RGBA values, transparent, orange, inherit</td>
|
|
<td>HTML4 keywords, RGB, RGBA, HSL, and HSLA values, transparent, X11 keywords, System Colors, flavor, attr(X,color), inherit
|
|
</td>
|
|
<td>depends on user agent</td>
|
|
</tr>
|
|
<tr class="no">
|
|
<td>'color-profile'</td>
|
|
<td>No</td>
|
|
<td>auto | sRGB | <name> | <uri> | inherit</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
<tr class="yes">
|
|
<td>'opacity'</td>
|
|
<td>Yes</td>
|
|
<td><alphavalue> | inherit</td>
|
|
<td>1</td>
|
|
</tr>
|
|
<tr class="no">
|
|
<td>'rendering-intent'</td>
|
|
<td>no</td>
|
|
<td>auto | perceptual | relative-colorimetric | saturation | absolute-colorimetric | inherit</td>
|
|
<td>auto</td>
|
|
</tr>
|
|
|
|
</tbody>
|
|
</table>
|
|
|
|
|
|
<!-- *************************************************************** -->
|
|
<!-- Syntax -->
|
|
<!-- *************************************************************** -->
|
|
|
|
<h2 id="section-syntax">5. CSS Syntax</h2>
|
|
|
|
<p>The CSS TV Profile uses the same syntax as specified in [<a href="#ref-css2">CSS2</a>]. The CSS TV Profile uses a subset of the values used in CSS2. Specifically:</p>
|
|
|
|
<ol>
|
|
<li>The TV-UA SHALL support integer and real numbers ([<a href="#ref-css2">CSS2</a>] Section 4.3.1).</li>
|
|
<li>The TV-UA SHALL support the following lengths ([<a href="#ref-css2">CSS2</a>] Section 4.3.2):
|
|
<ul>
|
|
<li>px</li>
|
|
<li>em</li>
|
|
<li>ex</li>
|
|
<li>in</li>
|
|
<li>cm</li>
|
|
<li>mm</li>
|
|
<li>pt</li>
|
|
<li>pc</li>
|
|
</ul>
|
|
The TV-UA MAY support other lengths.</li>
|
|
<li>The TV-UA SHALL support percentage values ([<a href="#ref-css2">CSS2</a>] Section 4.3.3).</li>
|
|
<li>The TV-UA SHALL support URI values ([<a href="#ref-css2">CSS2</a>] Section 4.3.4).</li>
|
|
<li>The TV-UA MAY support counter values ([<a href="#ref-css2">CSS2</a>] Section 4.3.5).</li>
|
|
<li>The TV-UA SHALL support the following color values ([<a href="#ref-css2">CSS2</a>] Section 4.3.6):
|
|
<ul>
|
|
<li>The 16 named colors defined in HTML 4.0 [<a href="#ref-html4">HTML4</a>],
|
|
orange and transparent as defined in CSS3 Module: Color [<a href="#ref-css3color">CSS3COLOR</a>]</li>
|
|
<li>A numerical RGB specification ([<a href="#ref-css2">CSS2</a>] Section 4.3.6)</li>
|
|
<li>A numerical RGBA specification as defined in [<a href="#ref-css3color">CSS3COLOR</a>] Section 4.2.2</li>
|
|
</ul>
|
|
The TV-UA MAY support other color values.
|
|
</li>
|
|
</ol>
|
|
|
|
<p>Similarly, the CSS TV Profile requires that conforming user agents support the character encoding mechanisms specified in [<a href="#ref-css2">CSS2</a>]. Specifically:</p>
|
|
|
|
<ol>
|
|
<li>The TV-UA SHALL support priorities specified in [<a href="#ref-css2">CSS2</a>] to determine a document's character encoding.</li>
|
|
<li>The TV-UA SHALL support the CSS2 @charset rules.</li>
|
|
</ol>
|
|
|
|
|
|
<!-- *************************************************************** -->
|
|
<!-- ASSIGNING PROPERTY VALUES, CASCADING, and INHERITANCE -->
|
|
<!-- *************************************************************** -->
|
|
|
|
<h2 id="section-assigning">6. Assigning Property Values, Cascading, and Inheritance</h2>
|
|
|
|
<p>In general, the CSS TV Profile uses the same cascading rules as in CSS2. Specifically:</p>
|
|
|
|
<ol>
|
|
<li>The TV-UA SHALL assign values as described in CSS2 ([<a href="#ref-css2">CSS2</a>] Section 6.1).</li>
|
|
<li>The TV-UA SHALL support inheritance as described in CSS2 ([<a href="#ref-css2">CSS2</a>] Section 6.2).</li>
|
|
<li>The TV-UA SHALL support the CSS2 @import rules as specified in CSS2 ([<a href="#ref-css2">CSS2</a>] Section 6.3).</li>
|
|
<li>The TV-UA SHALL support author originating style sheets. The TV-UA MAY support user or user-agent originating style sheets ([<a href="#ref-css2">CSS2</a>] Section 6.4).</li>
|
|
<li>The TV-UA SHALL support all CSS2 cascading mechanisms ([<a href="#ref-css2">CSS2</a>] Sections 6.4.1-6.4.4).</li>
|
|
</ol>
|
|
|
|
|
|
<!-- ******************** -->
|
|
<!-- MEDIA TYPES -->
|
|
<!-- ******************** -->
|
|
|
|
<h2 id="section-mediatypes">7. Media Types</h2>
|
|
|
|
<p>A CSS TV Profile conforming user agent MUST be able to process media-dependent style sheets as specified in CSS2 ([<a href="#ref-css2">CSS2</a>] Section 7). Specifically:</p>
|
|
|
|
<ol>
|
|
<li>The TV-UA SHALL support the CSS2 @media rules as specified in CSS2 ([<a href="#ref-css2">CSS2</a>] Section 7).</li>
|
|
<li>The TV-UA SHALL accept and process style sheets that target the <code>tv</code> media type.</li>
|
|
<li>The TV-UA SHALL accept and process style sheets that target the <code>all</code> media type.</li>
|
|
<li>The TV-UA SHALL accept style sheets that contain other (non-tv) media-dependent style sheets.</li>
|
|
<li>The TV-UA MAY process other media types (such as <code>screen</code> or <code>print</code>).</li>
|
|
</ol>
|
|
|
|
<p>The TV-UA is not required to satisfy the CSS2 conformance statement pertaining to the <code>tv</code> media type (see [<a href="#ref-css2">CSS2</a>] Section 7.3.1); the TV-UA need only satisfy the conformance statements in this specification.</p>
|
|
|
|
<!-- ************************** -->
|
|
<!-- ACKNOWLEDGEMENTS -->
|
|
<!-- ************************** -->
|
|
|
|
<h2 id="section-ack">8. Acknowledgements</h2>
|
|
<p>This document derives from the CSS Level 1 and CSS level 2 Recommendations, the CSS3 Module: Color and
|
|
the CSS Mobile Profile 1.0. We thank all CSS1, CSS2, CSS3 Module: Color and CSS Mobile Profile authors, editors and contributors. </p>
|
|
<p>We would like to thank the participants in the CSS Working Group,
|
|
especially Bert Bos, Chris Lilley, and Tapas Kanti Roy for their direct feedback on the draft. </p>
|
|
<p>We would like to thank the contributors on www-style@w3.org.
|
|
We would like to especially thank ARIB, Akihiko Handa, Joel Zdepski, Etan Wexler, Kynn Bartlett,
|
|
Björn Höhrmann, fantasai and Susan Lesch for their valuable comments on the drafts of this document.</p>
|
|
|
|
|
|
<!-- ******************* -->
|
|
<!-- REFERENCES -->
|
|
<!-- ******************* -->
|
|
|
|
<h2 id="section-references">Appendix A. Normative References</h2>
|
|
|
|
<dl>
|
|
<dt id="ref-css1">[CSS1]</dt>
|
|
<dd><a href="http://www.w3.org/TR/1999/REC-CSS1-19990111">Cascading Style Sheets, level 1</a>, H.W. Lie and B. Bos, 17
|
|
December 1996, revised 11 Jan 1999. Available at <a href="http://www.w3.org/TR/1999/REC-CSS1-19990111">http://www.w3.org/TR/1999/REC-CSS1-19990111</a>.</dd>
|
|
|
|
<dt id="ref-css2">[CSS2]</dt>
|
|
<dd><a href="http://www.w3.org/TR/1998/REC-CSS2-19980512">Cascading Style Sheets, level 2</a>, B. Bos, et al., 12 May 1998.
|
|
Available at <a href="http://www.w3.org/TR/1998/REC-CSS2-19980512">http://www.w3.org/TR/1998/REC-CSS2-19980512</a>.</dd>
|
|
|
|
<dt id="ref-css3color">[CSS3COLOR]</dt>
|
|
<dd><a href="http://www.w3.org/TR/2003/CR-css3-color-20030514">CSS3 Module: Color</a>, T. Çelik and C. Lilley, 14 May 2003. Available at <a href="http://www.w3.org/TR/2003/CR-css3-color-20030514">http://www.w3.org/TR/2003/CR-css3-color-20030514</a>.</dd>
|
|
|
|
<dt id="ref-html4">[HTML401]</dt>
|
|
<dd><a href="http://www.w3.org/TR/1999/REC-html401-19991224">HTML 4.01 Specification</a>, D. Raggett, A. Le Hors, I. Jacobs,
|
|
24 December 1999. Available at <a href="http://www.w3.org/TR/1999/REC-html401-19991224">http://www.w3.org/TR/1999/REC-html401-19991224</a>.</dd>
|
|
|
|
<dt id="ref-RFC2119">[RFC2119]</dt>
|
|
<dd><a href=
|
|
"http://www.ietf.org/rfc/rfc2119.txt">Key words for use in RFCs to Indicate Requirement Levels</a>, S.
|
|
Bradner, March 1997. Available at <a href=
|
|
"http://www.ietf.org/rfc/rfc2119.txt">http://www.ietf.org/rfc/rfc2119.txt</a>.</dd>
|
|
</dl>
|
|
</body>
|
|
|
|
</html>
|
|
<!-- Keep this comment at the end of the file
|
|
Local variables:
|
|
mode: sgml
|
|
sgml-declaration:"~/SGML/xml.dcl"
|
|
sgml-default-doctype-name:"html"
|
|
sgml-minimize-attributes:nil
|
|
sgml-nofill-elements:("pre" "style" "br")
|
|
End:
|
|
-->
|