Revision 903313 of CSS

<p><strong>层叠样式表</strong>&nbsp;(Cascading Style Sheets)，常缩写为&nbsp;<strong>CSS，</strong>&nbsp;是一种&nbsp;<a href="/zh-CN/docs/DOM/stylesheet">样式表 (stylesheet)</a>&nbsp;语言，用来描述&nbsp;<a href="/zh-CN/docs/HTML" title="The HyperText Mark-up Language">HTML</a>、<a href="/zh-CN/docs/XML" title="zh-CN/docs/XML">XML</a>（包括各种 XML 语言如&nbsp;<a href="/zh-CN/docs/SVG" title="zh-CN/docs/SVG">SVG</a>、<a href="/zh-CN/docs/XHTML" title="zh-CN/docs/XHTML">XHTML</a>）文档的呈现。CSS 描述怎样在<span style="line-height:inherit">屏幕、电子纸、音频或其它媒体上渲染</span><span style="line-height:inherit">结构化元素</span><span style="line-height:inherit">。</span></p>

<p>CSS 是开放网络&nbsp;<em style="line-height:21px">open web</em><span style="line-height:21px">&nbsp;</span><span style="line-height:inherit">的核心语言之一，由&nbsp;</span><a class="external" href="https://w3.org/Style/CSS/#specs" style="line-height: inherit;">W3C 规范</a>&nbsp;进行标准化<span style="line-height:inherit">。CSS 分为不同等级，现在 CSS1 已经废弃， CSS2.1 是推荐标准，&nbsp;</span><a href="/zh-CN/docs/CSS/CSS3" style="line-height: inherit;" title="CSS3">CSS3</a><span style="line-height:inherit">&nbsp;分成多个小模块，正在标准化中。</span></p>

<section id="sect1">
<ul class="card-grid">
 <li><span>CSS 参考手册</span>

  <p>适合资深 Web 开发者的<a href="/zh-CN/docs/Web/CSS/Reference" title="zh-CN/docs/Web/CSS/Reference">详细参考手册</a>，描述了 CSS 各个属性与概念。</p>
 </li>
 <li><span>CSS 教程</span>
  <p><a href="/zh-CN/docs/CSS/Getting_Started" title="zh-CN/docs/CSS/Getting_Started">入门教程</a>一步步帮助初学者入门，涵盖了所有的基础知识。</p>
 </li>
 <li><span>CSS3 示例</span>
  <p>演示 CSS 最新技术的<a href="/zh-CN/demos/tag/tech:css3" title="https://developer.mozilla.org/zh-CN/demos/tag/tech:css3">一些示例</a>，激发创新。</p>
 </li>
</ul>

<div class="row topicpage-table">
<div class="section">
<h2 class="Documentation" id="Documentation" name="Documentation">文档和教程</h2>

<dl>
 <dt>CSS 关键概念</dt>
 <dd>讲述<a href="/zh-CN/docs/CSS/Syntax" title="/zh-CN/docs/CSS/Syntax">语法</a>与基础知识，比如 <a href="/zh-CN/docs/CSS/Specificity" title="Specificity">权重 (specificity)</a>&nbsp;与 <a href="/zh-CN/docs/CSS/inheritance" title="inheritance">继承 (inheritance)</a>，<a href="/zh-CN/docs/CSS/box_model" title="Box model">盒模型 (box model)</a>&nbsp;与 <a href="/zh-CN/docs/CSS/margin_collapsing" title="Margin collapsing">外边距合并 (margin collapsing)</a>，<a href="/zh-CN/docs/CSS/Understanding_z-index/The_stacking_context" title="The stacking context">堆叠 (stacking)</a>&nbsp;与 <a href="/zh-CN/docs/CSS/block_formatting_context" title="block formatting context">块格式化上下文 (block-formattin contexts)</a>，<a href="/zh-CN/docs/CSS/initial_value" title="initial value">初始值 (initial)</a>、 <a href="/zh-CN/docs/WEB/CSS/computed_value" title="computed value">计算值 (computed)</a>&nbsp;与 <a href="/zh-CN/docs/CSS/used_value" title="used value">应用值 (used)</a>&nbsp;与 <a href="/zh-CN/docs/CSS/actual_value" title="actual value">实际值 (actual values)</a>，还有 <a href="/zh-CN/docs/WEB/CSS/Shorthand_properties" title="CSS/Shorthand_properties">复合属性 (shorthand properties)</a>&nbsp;等概念。</dd>
 <dt><a href="https://developer.mozilla.org/en-US/docs/Web/Guide/CSS" title="/en-US/docs/Web/Guide/CSS">CSS 开发者指南</a></dt>
 <dd>CSS 技术文章，可以帮助您学习 CSS 技术并使您的页面够炫。</dd>
 <dt><a href="/zh-CN/docs/Web/CSS/Common_CSS_Questions">CSS 常见问题</a></dt>
 <dd>解答了有关CSS的常见问题。</dd>
</dl>

<h2 class="Tools" id="Tools" name="Tools">CSS 开发工具</h2>

<ul>
 <li><a class="external" href="https://jigsaw.w3.org/css-validator/">W3C CSS Validation Service</a> 检查CSS是否有效<span class="external">。</span><a href="https://www.OnlineWebCheck.com/">OnlineWebCheck.com</a> 也提供CSS验证服务。这些都是重要的调试工具<span class="external">。</span></li>
 <li><a href="https://developer.mozilla.org/zh-CN/docs/Tools">Firefox Developer Tools</a> 允许通过 <a href="https://developer.mozilla.org/zh-CN/docs/Tools/Page_Inspector">Inspector</a> 和 <a href="https://developer.mozilla.org/zh-CN/docs/Tools/Style_Editor">Style Editor</a>&nbsp;工具查看和<span class="external">实时</span>编辑页面的CSS<span class="external">。</span></li>
 <li>Firefox<span class="external">&nbsp;</span><a class="link-https" href="https://addons.mozilla.org/zh-CN/firefox/addon/1843">Firebug</a>组件，<span class="external">是一个很流行的扩展，可以实时编辑网站的 CSS。对于测试很实用，当然不止于此。</span></li>
 <li><span class="external">Firefox&nbsp; </span><a class="link-https" href="https://addons.mozilla.org/zh-CN/firefox/addon/60">Web Developer</a>组件，可以实时编辑网站的 CSS，尽管不如 Firebug&nbsp;强大，但比它简单，</li>
 <li>Firefox <a class="external link-https" href="https://addons.mozilla.org/zh-CN/firefox/addon/179">EditCSS </a>扩展组件，可在边栏编辑 CSS。</li>
</ul>
</div>

<div class="section">
<h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">相关主题</h2>

<ul>
 <li>Mozilla&nbsp;<a href="/zh-CN/learn/css" title="https://developer.mozilla.org/zh-CN/learn/css">CSS 学习资料</a>。</li>
 <li>常与 CSS 一起使用的开放网络语言: <a href="/zh-CN/docs/HTML" title="zh-CN/docs/HTML">HTML</a>, <a href="/zh-CN/docs/SVG" title="SVG">SVG</a>, <a href="/zh-CN/docs/XHTML" title="zh-CN/docs/XHTML">XHTML</a>, <a href="/zh-CN/docs/XML" title="zh-CN/docs/XML">XML</a>。</li>
 <li>Mozilla CSS 扩展用途：<a href="/zh-CN/docs/XUL" title="zh-CN/docs/XUL">XUL</a>、Firefox、Thunderbird <a href="/zh-CN/docs/Extensions" title="zh-CN/docs/Extensions">扩展</a>与<a href="/zh-CN/docs/Themes" title="zh-CN/docs/Themes">主题</a>。</li>
</ul>
</div>
</div>
</section>

<p>{{CommunityBox("Web layout", "dev-tech-layout", "mozilla.dev.tech.layout", "", "Stack Overflow|https://stackoverflow.com/questions/tagged/css|CSS topics|Visit Stack Overflow, a collaboratively built and maintained Q&amp;A site. See if you can find an answer; if not, you can ask your question there.||CSS-Discuss|https://www.css-discuss.org/|CSS-Discuss mailing list|Join the css-discuss mailing list, which is dedicated to discussing practical, real-world use of CSS.")}}</p>