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.
421 lines
17 KiB
421 lines
17 KiB
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
|
|
|
|
<html lang=en>
|
|
<head><meta content="text/html; charset=utf-8" http-equiv=Content-Type>
|
|
|
|
<title>CSS Style Attributes</title>
|
|
<link href=default.css rel=stylesheet type="text/css">
|
|
<link href="http://www.w3.org/StyleSheets/TR/W3C-CR" rel=stylesheet
|
|
type="text/css">
|
|
|
|
<body>
|
|
<div class=head> <!--begin-logo-->
|
|
<p><a href="http://www.w3.org/"><img alt=W3C height=48
|
|
src="http://www.w3.org/Icons/w3c_home" width=72></a> <!--end-logo-->
|
|
|
|
<h1>CSS Style Attributes</h1>
|
|
|
|
<h2 class="no-num no-toc" id=longstatus-date>W3C Candidate Recommendation
|
|
12 October 2010</h2>
|
|
|
|
<dl>
|
|
<dt>This version:
|
|
|
|
<dd>
|
|
|
|
<dd><a
|
|
href="http://www.w3.org/TR/2010/CR-css-style-attr-20101012/">http://www.w3.org/TR/2010/CR-css-style-attr-20101012/</a>
|
|
|
|
<dt>Latest version:
|
|
|
|
<dd><a
|
|
href="http://www.w3.org/TR/css-style-attr">http://www.w3.org/TR/css-style-attr</a>
|
|
|
|
|
|
<dt>Previous version:
|
|
|
|
<dd><a
|
|
href="http://www.w3.org/TR/2010/WD-css-style-attr-20100121/">http://www.w3.org/TR/2010/WD-css-style-attr-20100121/</a>
|
|
|
|
|
|
<dt>Editors:
|
|
|
|
<dd class=vcard><a class="fn url" href="http://tantek.com/"
|
|
lang=tr>Tantek Çelik</a> (<span class="company role url">Invited
|
|
Expert</span>, formerly <a href="http://www.microsoft.com/">Microsoft
|
|
Corporation</a>) <<a class=email
|
|
href="mailto:tantek@cs.stanford.edu">tantek@cs.stanford.edu</a>>
|
|
|
|
<dd class=vcard><a class="fn n url"
|
|
href="http://fantasai.inkedblade.net/contact"><span
|
|
class=given-name>Elika</span> <abbr class=additional-name>J.</abbr>
|
|
<span class=family-name>Etemad</span></a> (<span class="company
|
|
role">Invited Expert</span>)
|
|
|
|
<dt>Previous Editors:
|
|
|
|
<dd class=vcard><a class="fn url"
|
|
href="http://www.w3.org/People/Bos/">Bert Bos</a> (<a class=org
|
|
href="http://www.w3.org/">W3C</a>), <<a class=email
|
|
href="mailto:bert@w3.org">bert@w3.org</a>>
|
|
|
|
<dd class=vcard><span class=fn>Marc Attinasi</span> (<span
|
|
class=org>AOL/Netscape</span>), <<a class=email
|
|
href="mailto:attinasi@netscape.com">attinasi@netscape.com</a>>
|
|
</dl>
|
|
<!--begin-copyright-->
|
|
<p class=copyright><a
|
|
href="http://www.w3.org/Consortium/Legal/ipr-notice#Copyright"
|
|
rel=license>Copyright</a> © 2010 <a
|
|
href="http://www.w3.org/"><acronym title="World Wide Web
|
|
Consortium">W3C</acronym></a><sup>®</sup> (<a
|
|
href="http://www.csail.mit.edu/"><acronym title="Massachusetts Institute
|
|
of Technology">MIT</acronym></a>, <a href="http://www.ercim.eu/"><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>
|
|
and <a
|
|
href="http://www.w3.org/Consortium/Legal/copyright-documents">document
|
|
use</a> rules apply.</p>
|
|
<!--end-copyright-->
|
|
<hr title="Separator for header">
|
|
</div>
|
|
|
|
<h2 class="no-num no-toc" id=abstract>Abstract</h2>
|
|
|
|
<p>Markup languages such as HTML <a href="#HTML401"
|
|
rel=biblioentry>[HTML401]<!--{{HTML401}}--></a> and SVG <a href="#SVG11"
|
|
rel=biblioentry>[SVG11]<!--{{SVG11}}--></a> provide a style attribute on
|
|
most elements, to hold inline style information that applies to those
|
|
elements. One of the possible style sheet languages is CSS. This draft
|
|
describes the syntax and interpretation of the CSS fragment that can be
|
|
used in such style attributes.
|
|
|
|
<h2 class="no-num no-toc" id=status>Status of this document</h2>
|
|
<!--begin-status-->
|
|
|
|
<p><em>This section describes the status of this document at the time of
|
|
its publication. Other documents may supersede this document. A list of
|
|
current W3C publications and the latest revision of this technical report
|
|
can be found in the <a href="http://www.w3.org/TR/">W3C technical reports
|
|
index at http://www.w3.org/TR/.</a></em>
|
|
|
|
<p>This document was produced by the <a
|
|
href="http://www.w3.org/Style/CSS/members">CSS Working Group</a> as a <a
|
|
href="http://www.w3.org/Consortium/Process/tr#RecsCR">Candidate
|
|
Recommendation.</a>
|
|
|
|
<p>A Candidate Recommendation is a document that has been widely reviewed
|
|
and is ready for implementation. W3C encourages everybody to 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?Subject=%5Bcss-style-attr%5D%20PUT%20SUBJECT%20HERE">
|
|
www-style@w3.org</a> (see <a
|
|
href="http://www.w3.org/Mail/Request">instructions</a>). When sending
|
|
e-mail, please put the text “css-style-attr” in the subject,
|
|
preferably like this: “[<!---->css-style-attr<!---->]
|
|
<em>…summary of comment…</em>”
|
|
|
|
<p>Publication as a Candidate Recommendation does not imply endorsement by
|
|
the W3C Membership. This is a draft document and may be updated, replaced
|
|
or obsoleted by other documents at any time. It is inappropriate to cite
|
|
this document as other than work in progress.
|
|
|
|
<p>This document was produced by a group operating under the <a
|
|
href="http://www.w3.org/Consortium/Patent-Policy-20040205/">5 February
|
|
2004 W3C Patent Policy</a>. W3C maintains a <a
|
|
href="http://www.w3.org/2004/01/pp-impl/32061/status"
|
|
rel=disclosure>public list of any patent disclosures</a> made in
|
|
connection with the deliverables of the group; that page also includes
|
|
instructions for disclosing a patent. An individual who has actual
|
|
knowledge of a patent which the individual believes contains <a
|
|
href="http://www.w3.org/Consortium/Patent-Policy-20040205/#def-essential">
|
|
Essential Claim(s)</a> must disclose the information in accordance with <a
|
|
href="http://www.w3.org/Consortium/Patent-Policy-20040205/#sec-Disclosure">
|
|
section 6 of the W3C Patent Policy</a>.</p>
|
|
<!--end-status-->
|
|
|
|
<p>For this specification to exit the CR stage, the following conditions
|
|
shall be met:
|
|
|
|
<ol>
|
|
<li>
|
|
<p>There must be at least two interoperable implementations. For the
|
|
purposes of this criterion, we define the following terms:</p>
|
|
|
|
<dl>
|
|
<dt>interoperable
|
|
|
|
<dd>
|
|
<p>passing the respective test case(s) in the <a
|
|
href="http://www.w3.org/Style/CSS/Test/">CSS test suite</a>, 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>
|
|
|
|
<dt>implementation
|
|
|
|
<dd>
|
|
<p>a user agent which:</p>
|
|
|
|
<ol>
|
|
<li>implements the specification.
|
|
|
|
<li>is available (i.e. publicly downloadable or available through some
|
|
other public point of sale mechanism). This is the "show me"
|
|
requirement.
|
|
|
|
<li>is shipped, or is a "nightly build" (i.e., a development version
|
|
for the next release), but is not experimental (i.e., a version
|
|
specifically designed to pass the test suite and not intended for
|
|
daily usage going forward).
|
|
</ol>
|
|
</dl>
|
|
|
|
<li>
|
|
<p>A minimum of one month of the CR period must elapse. That is, this
|
|
specification will not exit CR before 14 November 2010. When the
|
|
specification exits CR, an implementation report will be published. At
|
|
this point, no such report exists.</p>
|
|
</ol>
|
|
|
|
<p>A CSS Style Attributes <a href="http://www.w3.org/Style/CSS/Test/">Test
|
|
Suite</a> will be developed during the Candidate Recommendation phase of
|
|
this CSS Style Attributes specification.
|
|
|
|
<p>Changes since the last Working Draft are listed in the <a
|
|
href=issues-lc-2010.html>Disposition of Comments.</a>
|
|
|
|
<h2 class="no-num no-toc" id=contents>Table of contents</h2>
|
|
<!--begin-toc-->
|
|
|
|
<ul class=toc>
|
|
<li><a href="#intro"><span class=secno>1. </span>Introduction</a>
|
|
|
|
<li><a href="#conformance"><span class=secno>2. </span>Conformance</a>
|
|
|
|
<li><a href="#syntax"><span class=secno>3. </span>Syntax and Parsing</a>
|
|
|
|
<li><a href="#interpret"><span class=secno>4. </span>Cascading and
|
|
Interpretation</a>
|
|
|
|
<li><a href="#ack"><span class=secno>5. </span>Acknowledgments</a>
|
|
|
|
<li><a href="#references"><span class=secno>6. </span>References </a>
|
|
<ul class=toc>
|
|
<li class=no-num><a href="#normative-references">Normative
|
|
references</a>
|
|
|
|
<li class=no-num><a href="#informative-references">Informative
|
|
references</a>
|
|
</ul>
|
|
</ul>
|
|
<!--end-toc-->
|
|
|
|
<h2 id=intro><span class=secno>1. </span>Introduction</h2>
|
|
|
|
<p>Some document formats have a <dfn id=style-attribute>style
|
|
attribute</dfn> to permit the author to directly apply style information
|
|
to specific elements in documents. If a document format defines a style
|
|
attribute (whether named ‘<code class=property>style</code>’
|
|
or something else) and the attribute accepts CSS as its value, then this
|
|
specification defines that <dfn id=style-attribute0>style
|
|
attribute</dfn>’s syntax and interpretation.
|
|
|
|
<div class=example>
|
|
<p>The following example shows the use of the <code>style</code> attribute
|
|
in HTML <a href="#HTML401"
|
|
rel=biblioentry>[HTML401]<!--{{HTML401}}--></a>:</p>
|
|
|
|
<pre><p style="<em>color: #090; line-height: 1.2</em>">...</p></pre>
|
|
</div>
|
|
|
|
<h2 id=conformance><span class=secno>2. </span>Conformance</h2>
|
|
|
|
<p>A document or implementation cannot conform to CSS Style Attributes
|
|
alone, but can claim conformance to CSS Style Attributes if it satisfies
|
|
the conformance requirements in this specification when implementing CSS
|
|
together with style attribute handling as defined in a document language
|
|
that has one or more CSS style attributes.
|
|
|
|
<p>Conformance to CSS Style Attributes is defined for two classes:
|
|
|
|
<dl>
|
|
<dt><dfn id=document>document</dfn>
|
|
|
|
<dd>A document represented in a document language that defines a style
|
|
attribute for one or more of its elements.
|
|
|
|
<dt><dfn id=interpreter>interpreter</dfn>
|
|
|
|
<dd>Someone or something that interprets the semantics of a document and
|
|
its associated style information. (Most CSS <a
|
|
href="http://www.w3.org/TR/CSS21/conform.html#user-agent">user agents</a>
|
|
fall under this category.)
|
|
</dl>
|
|
|
|
<p>The conformance requirements are expressed with a combination of
|
|
descriptive assertions and RFC 2119 terminology. The key words "MUST",
|
|
"MUST NOT", "REQUIRED", "SHALL", "SHALL NOT", "SHOULD", "SHOULD NOT",
|
|
"RECOMMENDED", "MAY", and "OPTIONAL" in the normative parts of this
|
|
document are to be interpreted as described in RFC 2119. However, for
|
|
readability, these words do not appear in all uppercase letters in this
|
|
specification. All of the text of this specification is normative except
|
|
sections explicitly marked as non-normative, examples, and notes. <a
|
|
href="#RFC2119" rel=biblioentry>[RFC2119]<!--{{!RFC2119}}--></a>
|
|
|
|
<p>Examples in this specification are introduced with the words "for
|
|
example" or are set apart from the normative text with
|
|
<code>class="example"</code>, like this:
|
|
|
|
<div class=example>
|
|
<p>This is an example of an informative example.</p>
|
|
</div>
|
|
|
|
<p>Informative notes begin with the word "Note" and are set apart from the
|
|
normative text with <code>class="note"</code>, like this:
|
|
|
|
<p class=note>Note, this is an informative note.
|
|
|
|
<h2 id=syntax><span class=secno>3. </span>Syntax and Parsing</h2>
|
|
|
|
<p>The value of the style attribute must match the syntax of the contents
|
|
of a CSS <a
|
|
href="http://www.w3.org/TR/CSS21/syndata.html#rule-sets">declaration
|
|
block</a> (excluding the delimiting braces), whose formal grammar is given
|
|
below in the terms and conventions of the <a
|
|
href="http://www.w3.org/TR/CSS21/syndata.html#syntax">CSS core
|
|
grammar</a>:
|
|
|
|
<pre>
|
|
declaration-list
|
|
: S* declaration? [ ';' S* declaration? ]*
|
|
;
|
|
</pre>
|
|
|
|
<p class=note>Note that following the CSS2.1 convention, comment tokens are
|
|
not shown in the rule above.
|
|
|
|
<p>The interpreter must parse the style attribute's value using the same
|
|
forward-compatible parsing rules that apply to parsing declaration block
|
|
contents in a normal CSS style sheet. See <a
|
|
href="http://www.w3.org/TR/CSS21/syndata.html">chapter 4 of the CSS2.1
|
|
specification</a> for details. <a href="#CSS21"
|
|
rel=biblioentry>[CSS21]<!--{{!CSS21}}--></a>
|
|
|
|
<p class=note>Note that because there is no open brace delimiting the
|
|
declaration list in the CSS style attribute syntax, a close brace
|
|
(<code>}</code>) in the style attribute's value does not terminate the
|
|
style data: it is merely an invalid token.
|
|
|
|
<h2 id=interpret><span class=secno>4. </span>Cascading and Interpretation</h2>
|
|
|
|
<p>The declarations in a style attribute apply to the element to which the
|
|
attribute belongs. In the cascade, these declarations are considered to
|
|
have author origin and a specificity higher than any selector. CSS2.1 <a
|
|
href="http://www.w3.org/TR/CSS21/cascade.html#specificity">defines</a> how
|
|
style sheets and style attributes are cascaded together. <a href="#CSS21"
|
|
rel=biblioentry>[CSS21]<!--{{!CSS21}}--></a> Relative URLs in the style
|
|
data must be resolved relative to the style attribute's element (or to the
|
|
document if per-element resolution is not defined) when the attribute's
|
|
value is parsed<!-- so dynamic changes to
|
|
the base URL don't affect the CSS ~Hixie -->.
|
|
|
|
|
|
<p>Aside from the differences in cascading, the declarations in a style
|
|
attribute must be interpreted exactly as if they were given in a CSS style
|
|
rule that applies to the element.
|
|
|
|
<p>The CSS Working Group strongly recommends that document languages do not
|
|
allow multiple CSS style attributes on a single element. If a document
|
|
language allows multiple CSS style attributes, each must be parsed
|
|
independently and treated as a separate style rule, the ordering of which
|
|
should be defined by the document language, else is undefined.
|
|
|
|
<h2 id=ack><span class=secno>5. </span>Acknowledgments</h2>
|
|
|
|
<p>Thanks to feedback from <span class=vcard><span class=fn>Daniel
|
|
Glazman</span></span>, <span class=vcard><span class=fn>Ian
|
|
Hickson</span></span>, <span class=vcard><span class="fn n"><span
|
|
class=given-name>Eric</span> <abbr class=additional-name>A.</abbr> <span
|
|
class=family-name>Meyer</span></span></span>, <span class=vcard><span
|
|
class=fn>Björn Höhrmann</span></span>.
|
|
|
|
<h2 id=references><span class=secno>6. </span>References</h2>
|
|
|
|
<h3 class=no-num id=normative-references>Normative references</h3>
|
|
<!--begin-normative-->
|
|
<!-- Sorted by label -->
|
|
|
|
<dl class=bibliography>
|
|
<dt style="display: none"><!-- keeps the doc valid if the DL is empty -->
|
|
<!---->
|
|
|
|
<dt id=CSS21>[CSS21]
|
|
|
|
<dd>Bert Bos; et al. <a
|
|
href="http://www.w3.org/TR/2009/CR-CSS2-20090908"><cite>Cascading Style
|
|
Sheets Level 2 Revision 1 (CSS 2.1) Specification.</cite></a> 8 September
|
|
2009. W3C Candidate Recommendation. (Work in progress.) URL: <a
|
|
href="http://www.w3.org/TR/2009/CR-CSS2-20090908">http://www.w3.org/TR/2009/CR-CSS2-20090908</a>
|
|
</dd>
|
|
<!---->
|
|
|
|
<dt id=RFC2119>[RFC2119]
|
|
|
|
<dd>S. Bradner. <a href="http://www.ietf.org/rfc/rfc2119.txt"><cite>Key
|
|
words for use in RFCs to Indicate Requirement Levels.</cite></a> Internet
|
|
RFC 2119. URL: <a
|
|
href="http://www.ietf.org/rfc/rfc2119.txt">http://www.ietf.org/rfc/rfc2119.txt</a>
|
|
</dd>
|
|
<!---->
|
|
</dl>
|
|
<!--end-normative-->
|
|
|
|
<h3 class=no-num id=informative-references>Informative references</h3>
|
|
<!--begin-informative-->
|
|
<!-- Sorted by label -->
|
|
|
|
<dl class=bibliography>
|
|
<dt style="display: none"><!-- keeps the doc valid if the DL is empty -->
|
|
<!---->
|
|
|
|
<dt id=HTML401>[HTML401]
|
|
|
|
<dd>David Raggett; Ian Jacobs; Arnaud Le Hors. <a
|
|
href="http://www.w3.org/TR/1999/REC-html401-19991224"><cite>HTML 4.01
|
|
Specification.</cite></a> 24 December 1999. W3C Recommendation. URL: <a
|
|
href="http://www.w3.org/TR/1999/REC-html401-19991224">http://www.w3.org/TR/1999/REC-html401-19991224</a>
|
|
</dd>
|
|
<!---->
|
|
|
|
<dt id=SVG11>[SVG11]
|
|
|
|
<dd>Erik Dahlström; et al. <a
|
|
href="http://www.w3.org/TR/2010/WD-SVG11-20100622"><cite>Scalable Vector
|
|
Graphics (SVG) 1.1 (Second Edition).</cite></a> 22 June 2010. W3C Working
|
|
Draft. (Work in progress.) URL: <a
|
|
href="http://www.w3.org/TR/2010/WD-SVG11-20100622">http://www.w3.org/TR/2010/WD-SVG11-20100622</a>
|
|
</dd>
|
|
<!---->
|
|
</dl>
|
|
<!--end-informative-->
|
|
</html>
|
|
<!-- Keep this comment at the end of the file
|
|
Local variables:
|
|
mode: sgml
|
|
sgml-declaration:"~/SGML/HTML4.decl"
|
|
sgml-default-doctype-name:"html"
|
|
sgml-minimize-attributes:t
|
|
sgml-nofill-elements:("pre" "style" "br")
|
|
End:
|
|
-->
|