diff options
Diffstat (limited to 'files/zh-cn/archive/meta_docs/custom_classes/index.html')
-rw-r--r-- | files/zh-cn/archive/meta_docs/custom_classes/index.html | 239 |
1 files changed, 0 insertions, 239 deletions
diff --git a/files/zh-cn/archive/meta_docs/custom_classes/index.html b/files/zh-cn/archive/meta_docs/custom_classes/index.html deleted file mode 100644 index 77a4ca21c9..0000000000 --- a/files/zh-cn/archive/meta_docs/custom_classes/index.html +++ /dev/null @@ -1,239 +0,0 @@ ---- -title: 'Project:自定义_CSS_类' -slug: Archive/Meta_docs/Custom_classes -tags: - - 所有分类 -translation_of: Archive/Meta_docs/Custom_classes ---- -<p></p><div class="standardSidebar"> - <div><a href="/Help:cn/%E7%9B%AE%E5%BD%95" style="font-size: large;">帮助目录</a></div> - - <dl> - <dt>指导</dt> - <dd> - <ul style="padding: 0;"> - <li><a href="/zh-CN/docs/Project:%E7%8E%B0%E5%9C%A8%E5%B0%B1%E5%BC%80%E5%A7%8B">现在就开始</a></li> - <li><a href="/zh-CN/docs/Project:%E7%BC%96%E8%80%85%E5%90%91%E5%AF%BC">编者向导</a></li> - <li><a href="/zh-CN/docs/Project:%E9%A1%B5%E9%9D%A2%E5%91%BD%E5%90%8D%E6%8C%87%E5%8D%97">页面命名指南</a></li> - <li><a href="/zh-CN/docs/Project:%E6%B6%88%E6%AD%A7%E4%B9%89">消歧义页</a></li> - <li><a href="/zh-CN/docs/Project:%E6%9C%AC%E5%9C%B0%E5%8C%96%E9%A1%B9%E7%9B%AE">开始一项新的mdc本地化项目</a></li> - <li><a href="/zh-CN/docs/Project:%E7%89%88%E6%9D%83">版权和许可</a></li> - </ul> - </dd> - - <dt>参考</dt> - <dd> - <ul style="padding: 0;"> - <li><a href="/zh-CN/docs/Project:Wiki%E6%A0%87%E8%AE%B0%E8%AF%AD%E6%B3%95%E5%8F%82%E8%80%83">维基语法参考</a></li> - <li><a href="/zh-CN/docs/Project:%E8%87%AA%E5%AE%9A%E4%B9%89_CSS_%E7%B1%BB">自定义 CSS 类</a></li> - <li><a href="/zh-CN/docs/Project:%E8%87%AA%E5%AE%9A%E4%B9%89%E6%A8%A1%E6%9D%BF">自定义模板</a></li> - <li><a href="/zh-CN/docs/Project:MediaWiki_%E6%89%A9%E5%B1%95">MediaWiki 扩展</a></li> - <li><a href="/zh-CN/docs/Project:%E5%A4%96%E9%83%A8%E9%87%8D%E5%AE%9A%E5%90%91">外部重定向</a></li> - <li><a href="/zh-CN/docs/Project:%E9%9C%80%E8%A6%81%E9%87%8D%E5%AE%9A%E5%90%91">需要重定向</a></li> - </ul> - </dd> - - <dt>列表</dt> - <dd> - <ul style="padding: 0;"> - <li><a href="/zh-CN/docs/Project:%E6%96%87%E6%A1%A3%E8%AF%B7%E6%B1%82%E5%88%97%E8%A1%A8">文档请求列表</a></li> - <li><a href="/zh-CN/docs/Project:To_Do_List">Editing/review to do list</a></li> - <li><a href="/zh-CN/docs/Project:%E5%B7%B2%E6%9C%89%E5%86%85%E5%AE%B9">合并列表</a></li> - </ul> - </dd> - </dl> - -</div><p></p> - -<p>下面的内容,将介绍如何在 Devmo wiki 中自定义 CSS 类。无论任何原因,如果您需要为本 wiki 创建自定义 CSS 类,请随时联系 <a>Dria</a>.</p> - -<h3 id=".E5.AE.9A.E4.B9.89_CSS_.E7.B1.BB" name=".E5.AE.9A.E4.B9.89_CSS_.E7.B1.BB">定义 CSS 类</h3> - -<table class="fullwidth-table"> - <tbody> - <tr> - <td class="header">类</td> - <td class="header">结果</td> - </tr> - <tr> - <td><code>div.tip</code></td> - <td>显示 tip 文本,范围不超出一个页的 body 部分。</td> - </tr> - <tr> - <td><code>div.bug</code></td> - <td>显示 bug 文本,范围不超出一个页的 body 部分。</td> - </tr> - <tr> - <td><code>.float-left</code></td> - <td>创建一个左向流 left-float 元素(通常是图形)</td> - </tr> - <tr> - <td><code>.float-right</code></td> - <td>创建一个右向流 right-float 元素(通常是图形)</td> - </tr> - <tr> - <td><code>.figure</code></td> - <td>定义一个未使用内容,不包含任何当前风格</td> - </tr> - <tr> - <td><code>.standard-table</code></td> - <td>基础标准表(table)风格。</td> - </tr> - <tr> - <td><code>.standard-table td.header</code></td> - <td>标准表(table)的表头风格。</td> - </tr> - <tr> - <td><code>.fullwidth-table</code></td> - <td>宽度设置为 100% 的表。(就像现在你正在看的这个表)</td> - </tr> - <tr> - <td><code>.fullwidth-table td.header</code></td> - <td>宽度设为 100% 的表的表头风格。</td> - </tr> - <tr> - <td><code>div.breadcrumbs</code></td> - <td>breadcrumbs 用户导航风格</td> - </tr> - <tr> - <td><code>div.breadcrumbs a.breadcrumbs</code></td> - <td>breadcrumbs 字符串用户导航风格。</td> - </tr> - <tr> - <td><code>div.breadcrumbs span.breadcrumbs</code></td> - <td>breadcrumbs 字符串导航中的本页内部标题风格。</td> - </tr> - <tr> - <td><code>div.side-note-left div.side-note-right</code></td> - <td>用来创建一个靠单方向的文本框。它将在父级文本(通常是文档本身)中,占据一个50%宽度的文本框。建议在使用的时候,左右方向交替使用,以便提高文档的可读性。</td> - </tr> - <tr> - <td><code>div.highlight</code></td> - <td>在左侧为段落创建一个三像素宽的蓝条。</td> - </tr> - <tr> - <td><code>.highlightred</code></td> - <td>文本颜色变为红色</td> - </tr> - <tr> - <td><code>.highlightblue</code></td> - <td>文本颜色变为蓝色</td> - </tr> - <tr> - <td><code>.highlightgreen</code></td> - <td>文本颜色变为绿色</td> - </tr> - </tbody> -</table> - -<h3 id=".E4.BE.8B.E5.AD.90" name=".E4.BE.8B.E5.AD.90">例子</h3> - -<h4 id=".E9.AB.98.E4.BA.AE.E7.9A.84.E4.BB.A3.E7.A0.81" name=".E9.AB.98.E4.BA.AE.E7.9A.84.E4.BB.A3.E7.A0.81">高亮的代码</h4> - -<p>我们经常会希望提请读者注意某段代码。这是可能通过使用spans,还用mediawiki内建的代码格式"indent-at-least-one-space" (“缩进至少一个空格”)。请注意,在<span class="nowiki"><pre></span>块内使用spans是没有用的,因为mediawiki分析器忽略了spans,而直接把他们作为代码的一部分输出。</p> - -<pre><span class="highlightred">这样不会有效</span> -</pre> - -<p>取代它的方法是,缩进你想要放在高亮部分的代码,并且在内部使用spans。注意,在代码中,空行也是需要缩进的。如果在空行前面没有空格,那么前一个段落将被解释器关闭,并另起一个新段落。</p> - -<pre class="eval">here is an example of - a <span class="highlightred">codeblock</span> with a blank line -</pre> - -<pre class="eval"> that is not <span class="highlightblue">indented</span>. -</pre> - -<p>很显然,上面是一个反面例子,正确的做法应该像下面这样的:</p> - -<pre class="eval">here is an example of - a <span class="highlightred">codeblock</span> with a blank line - - that is <span class="highlightblue">indented</span>. -</pre> - -<h4 id="Breadcrumbs" name="Breadcrumbs">Breadcrumbs</h4> - -<p> </p> - -<ul> - <li>例子请参见 <a href="cn/Core_JavaScript_1.5_Reference/About">Core JavaScript 1.5 Reference:About</a> 。</li> -</ul> - -<h4 id="table.standard-table" name="table.standard-table">table.standard-table</h4> - -<table class="standard-table"> - <tbody> - <tr> - <th>表标题 1</th> - <th>表标题 2</th> - </tr> - <tr> - <td>这里是一个例子:</td> - <td><code>table.standard-table</code></td> - </tr> - </tbody> -</table> - -<h4 id="table.fullwidth-table" name="table.fullwidth-table">table.fullwidth-table</h4> - -<table class="fullwidth-table"> - <tbody> - <tr> - <th>表标题 1</th> - <th>表标题 2</th> - </tr> - <tr> - <td>这是一个例子:</td> - <td><code>table.fullwidth-table</code></td> - </tr> - </tbody> -</table> - -<h4 id="Divs" name="Divs">Divs</h4> - -<h5 id="Tips" name="Tips">Tips</h5> - -<p>使用 <code>div class="note"</code> 格式化 tip:</p> - -<div class="note">这是一个 tip</div> - -<h5 id="Bugs" name="Bugs">Bugs</h5> - -<p>使用 <code>div class="bug"</code> 引用已知的 bug,可以创建指向bugzilla的bug连接:</p> - -<div class="bug"><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=176320">Bug 176320: Minimal innerWidth/innerHeight values for popup windows</a></div> - -<h5 id="Warnings" name="Warnings">Warnings</h5> - -<p>使用 <code>div class="warning"</code> 将一段文档做成警告高亮。最后,我们回做一些很酷的事情,并且加一些图标啊什么的。</p> - -<div class="warning">这是一个 warning.</div> - -<h5 id="Notes" name="Notes">Notes</h5> - -<p><code>div class="note"</code> (via <a>Template:Note</a>) 用来将一段文档标记为一段笔记。不要直接使用 div 类,最好用模板<a>template</a>.</p> - -<div class="side-note-left">这是个左边的 note。</div> - -<p>分别演示side-note-levt和side-note-right</p> - -<div class="side-note-right">这是个右边的 note。</div> - -<p> </p> - -<h5 id=".E9.AB.98.E4.BA.AE.E6.AE.B5.E8.90.BD" name=".E9.AB.98.E4.BA.AE.E6.AE.B5.E8.90.BD">高亮段落</h5> - -<p><code>div class="highlight"</code> 的例子:</p> - -<div class="highlight"> -<p>这是一个段落 CSS 高亮的例子。通过这个方法可以让你的代码引起注意。最初,这个功能是在 <a href="cn/XUL_Tutorial">XUL Tutorial</a> 中添加进来的。</p> - -<pre>这段例子 - 演示了使用 - div - 高亮的情况 -</pre> -</div> - -<p></p> |