可折叠的窗格

何时使用

可折叠窗格允许您在隐藏窗格中隐藏文本块,并在用户单击窗格标题时显示它们。例如,在创建列表的长列表时,此功能可能很有用,您希望将列表标题保持在折叠上方。可折叠窗格比其他一些短代码更复杂,但它们仍然相对容易掌握!

基本用法:

[collapse-pane title =“标题”)内容(endcollapse-pane)

  1. 开始打开可折叠窗格:
    [collapse-pane
  2. 添加所需的title属性,将其值设置为您希望出现在窗格顶部的标题,并添加最后的括号:
    title= "可折叠窗格的标题。]
  3. 添加要显示在窗格中的内容:
    可折叠窗格的内容。
  4. 关闭可折叠窗格:
    (endcollapse-pane)

结果

代码


[collapse-pane title= "可折叠窗格的标题。"]
可折叠窗格的内容。
(endcollapse-pane)

呈现


可折叠窗格的标题
扩大

可折叠窗格的内容。


a中的特殊字符、引号、星号等标题值必须作为HTML实体输入。请看下面的例子。关于HTML实体的更多信息请访问W3学校

颜色属性

就像普通的玻璃一样(collapse-pane)有一个可选属性:颜色.此属性更改背景颜色或窗格。颜色有六个允许值:蓝色,灰色,绿色,浅灰色,橙色而且红色的.下面是颜色属性使用示例以及标题中特殊字符的HTML实体示例。

颜色= "蓝色"

代码


[collapse-pane title= " The "一个蓝色的可折叠窗格,HTML实体双引号围绕单词标题。“颜色= "蓝色")
一些有趣的内容在一个蓝色可折叠窗格。
(endcollapse-pane)

呈现


蓝色可折叠窗格的“标题”,HTML实体的双引号围绕着单词标题。
扩大

一些有趣的内容隐藏在一个蓝色的可折叠窗格。

颜色= "灰色"

代码


[collapse-pane title= "标题中带有版权符号HTML实体的灰色可折叠窗格;" color= " gray "]
一些有趣的内容在一个灰色可折叠的窗格。
(endcollapse-pane)

呈现


灰色可折叠窗格,标题中有版权符号HTML实体©
扩大

一些有趣的内容隐藏在一个蓝色的可折叠窗格。

颜色= "绿色"

代码


[collapse-pane title= "一个绿色的可折叠窗格,其商标符号HTML实体在标题® " color= " green "]
一些有趣的内容在绿色可折叠窗格。
(endcollapse-pane)

呈现


一个绿色可折叠面板,在标题®中带有商标符号HTML实体
扩大

一些有趣的内容隐藏在一个绿色可折叠的窗格。

颜色= "灰色"

代码


[collapse-pane title= "标题中带有撇号的浅灰色可折叠窗格' " color= "浅灰色"]
一些有趣的内容在浅灰色可折叠窗格。
(endcollapse-pane)

呈现


标题中带有撇号HTML实体的浅灰色可折叠窗格
扩大

一些有趣的内容隐藏在浅灰色可折叠的窗格。

颜色= "橙色"

代码


[collapse-pane title= "一个橙色的可折叠窗格,标题中有引号和撇号HTML实体:"朝圣者的进程";color= " orange "]
一些有趣的内容在一个橙色的可折叠窗格。
(endcollapse-pane)

呈现


一个橙色的可折叠窗格,标题中有引号和撇号HTML实体:“Pilgrim’s progress”
扩大

一些有趣的内容隐藏在一个橙色的折叠窗格。

颜色= "红色"

代码


[collapse-pane title= "一个红色可折叠窗格,标题中包含英镑、欧元和美分HTML实体:£欧洲商学院分;“颜色=“红”)
一些有趣的内容在一个红色可折叠窗格。
(endcollapse-pane)

呈现


一个红色可折叠窗格,标题中有英镑、欧元和美分HTML实体:£€¢
扩大

一些有趣的内容隐藏在一个红色可折叠窗格。