How edit

出自新阅读实验室

（修订版本间差异）
跳转到： 导航, 搜索
(→未来教育家工作坊编辑指南)
(→颜色)
 
（9个中途的修订版本没有显示）
第5行： 第5行：
-
# 添加了wikitable类 ，使用时直接在表格<pre style="display: inline; width: auto;margin: 0;padding:0;">{|</pre>后加入 <pre style="display: inline; width: auto; margin: 0;padding:0;">class="wikitable"</pre>即可得到背景为灰色，边框宽度为1px，颜色为<span style="background: #aaa">#AAA</span>的表格；
+
# 添加了wikitable类 ，使用时直接在表格<pre class="graybg" style="display: inline; width: auto;margin: 0;padding:0;">{|</pre>后加入 <pre class="graybg" style="display: inline; width: auto; margin: 0;padding:0;" class="graybg">class="wikitable"</pre>即可得到背景为灰色，边框宽度为1px，颜色为<span style="background: #aaa">#AAA</span>的表格；
-
# 想得到 <pre style="display: inline; width: auto; margin: 0;padding:0;">加粗且背景加深</pre>的表格头，只需用 <pre style="display: inline; width: auto;margin: 0;padding:0;">!(需要换行)或!!(不需要换行)</pre>代替即可，例如
+
# 想得到 <pre style="display: inline; width: auto; margin: 0;padding:0; " class="graybg">加粗且背景加深</pre>的表格头，只需用 <pre style="display: inline; width: auto;margin: 0;padding:0;" class="graybg">!(需要换行)或!!(不需要换行)</pre>代替即可，例如
{| width="80%"
{| width="80%"
第79行： 第79行：
# class是可以覆盖的，如：class="redcolor greencolor"将显示绿色;
# class是可以覆盖的，如：class="redcolor greencolor"将显示绿色;
# 为了美观，并没有使用原色，而是用中间色代替原色。
# 为了美观，并没有使用原色，而是用中间色代替原色。
 +
{|
 +
|width="60%"|
{|class="wikitable"
{|class="wikitable"
-
!类名!!颜色值!!类名!!颜色值
+
!颜色!!类名(文字颜色)!!类名(背景色)!!十六进制
|-
|-
-
|redcolor
+
|红色
-
|class="redcolor"|#b22222
+
|class="redcolor"|redcolor
-
|redbg
+
|class="redbg"|redbg
-
|class="redbg"|#b22222
+
|#b22222
|-
|-
-
|greencolor
+
|绿色
-
|class="greencolor"|#0e774a
+
|class="greencolor"|greencolor
-
|greenbg
+
|class="greenbg"|greenbg
-
|class="greenbg"|#0e774a
+
|#0e774a
|-
|-
-
|bluecolor
+
|蓝色
-
|class="bluecolor"|#0046ff
+
|class="bluecolor"|bluecolor
-
|bluebg
+
|class="bluebg"|bluebg
-
|class="bluebg"|#0046ff
+
|#0046ff
|-
|-
-
|orangecolor
+
|橘色
-
|class="orangecolor"|#ff8c00
+
|class="orangecolor"|orangecolor
-
|orangebg
+
|class="orangebg"|orangebg
-
|class="orangebg"|#ff8c00
+
|#ff8c00
|-
|-
-
|yellowcolor
+
|黄色
-
|class="yellowcolor"|#ffd700
+
|class="yellowcolor"|yellowcolor
-
|yellowbg
+
|class="yellowbg"|yellowbg
-
|class="yellowbg"|#ffd700
+
|#ffd700
|-
|-
-
|perucolor
+
|褐色
-
|class="perucolor"|#d2691e
+
|class="perucolor"|perucolor
-
|perubg
+
|class="perubg"|perubg
-
|class="perubg"|#d2691e
+
|#d2691e
|-
|-
-
|graycolor
+
|灰色
-
|class="graycolor"|#c0c0c0
+
|class="graycolor"|graycolor
-
|grayebg
+
|class="graybg"|grayebg
-
|class="graybg"|#c0c0c0
+
|#c0c0c0
 +
|-
 +
|海绿/seagreen
 +
|class="seagreencolor" | seagreencolor
 +
|class="seagreenbg" | seagreencolor
 +
|#2E8B57
|}
|}
 +
|<pre>
 +
{|class="wikitable"
 +
!颜色!!类名(文字颜色)!!类名(背景色)!!十六进制
 +
|-
 +
|红色
 +
|class="redcolor"|redcolor
 +
|class="redbg"|redbg
 +
|#b22222
 +
|-
 +
|绿色
 +
|class="greencolor"|greencolor
 +
|class="greenbg"|greenbg
 +
|#0e774a
 +
|-
 +
|蓝色
 +
|class="bluecolor"|bluecolor
 +
|class="bluebg"|bluebg
 +
|#0046ff
 +
|-
 +
|橘色
 +
|class="orangecolor"|orangecolor
 +
|class="orangebg"|orangebg
 +
|#ff8c00
 +
|-
 +
|黄色
 +
|class="yellowcolor"|yellowcolor
 +
|class="yellowbg"|yellowbg
 +
|#ffd700
 +
|-
 +
|褐色
 +
|class="perucolor"|perucolor
 +
|class="perubg"|perubg
 +
|#d2691e
 +
|-
 +
|灰色
 +
|class="graycolor"|graycolor
 +
|class="graybg"|grayebg
 +
|#c0c0c0
 +
|-
 +
|海绿/seagreen
 +
|class="seagreencolor" | seagreencolor
 +
|class="seagreenbg" | seagreencolor
 +
|#2E8B57
 +
|}
 +
</pre>
 +
|}
 +
 +
另，html颜色参见[http://zh.wikipedia.org/wiki/%E7%BD%91%E9%A1%B5%E9%A2%9C%E8%89%B2 网页颜色]
-
参[http://zh.wikipedia.org/wiki/%E7%BD%91%E9%A1%B5%E9%A2%9C%E8%89%B2 网页颜色]
+
::例如：

在2011年5月9日 (一) 04:42的最新修订版本

编辑指南

为了更加方便的编辑，也为了使内容更加易读美观，我添加了一些class，以方便在编辑的时候直接使用，更加人性化、语义化的编辑:

表格

  1. 添加了wikitable类 ，使用时直接在表格
    {|
    后加入 
    class="wikitable"
    即可得到背景为灰色，边框宽度为1px，颜色为#AAA的表格；
  2. 想得到 
    加粗且背景加深
    的表格头，只需用 
    !(需要换行)或!!(不需要换行)
    代替即可，例如
类别一 类别二
橘子 苹果
面包 饼
奶油 冰淇凌 
{|
|类别一
|类别二
|-
|橘子
|苹果
|-
|面包
|饼
|-
|奶油
|冰淇凌 
|}

替换为

类别一类别二
橘子 苹果
面包 饼
奶油 冰淇凌 
{|
!类别一!!类别二
|-
|橘子
|苹果
|-
|面包
|饼
|-
|奶油
|冰淇凌 
|}

颜色

为了更加方便的编辑，使wiki代码更加干净整洁，在css中添加了常用颜色的类，使用时只需给需要颜色的位置添加class="xxxxxcolor"，需要背景颜色的位置添加class="XXXbg"即可，

PS：

  1. class是可以覆盖的，如：class="redcolor greencolor"将显示绿色;
  2. 为了美观，并没有使用原色，而是用中间色代替原色。
颜色类名(文字颜色)类名(背景色)十六进制
红色 redcolor redbg #b22222
绿色 greencolor greenbg #0e774a
蓝色 bluecolor bluebg #0046ff
橘色 orangecolor orangebg #ff8c00
黄色 yellowcolor yellowbg #ffd700
褐色 perucolor perubg #d2691e
灰色 graycolor grayebg #c0c0c0
海绿/seagreen seagreencolor seagreencolor #2E8B57 
{|class="wikitable"
!颜色!!类名(文字颜色)!!类名(背景色)!!十六进制
|-
|红色
|class="redcolor"|redcolor
|class="redbg"|redbg
|#b22222
|-
|绿色
|class="greencolor"|greencolor
|class="greenbg"|greenbg
|#0e774a
|-
|蓝色
|class="bluecolor"|bluecolor
|class="bluebg"|bluebg
|#0046ff
|-
|橘色
|class="orangecolor"|orangecolor
|class="orangebg"|orangebg
|#ff8c00
|-
|黄色
|class="yellowcolor"|yellowcolor
|class="yellowbg"|yellowbg
|#ffd700
|-
|褐色
|class="perucolor"|perucolor
|class="perubg"|perubg
|#d2691e
|-
|灰色
|class="graycolor"|graycolor
|class="graybg"|grayebg
|#c0c0c0
|-
|海绿/seagreen
|class="seagreencolor" | seagreencolor
|class="seagreenbg" | seagreencolor
|#2E8B57
|}

另，html颜色参见网页颜色

例如：
取自“http://simple-education.org/w/How_edit”
个人工具
名字空间
变换
动作
导航
工具箱