「利用者:Adminkoyama100/sandbox」の版間の差分

提供:八中・小山台デジタルアーカイブ
ナビゲーションに移動 検索に移動
8行目: 8行目:


But this will work:
But this will work:
:と言うが機能していないようだ。


{{#tag:tabs|
{{#tag:tabs|
13行目: 14行目:
{{#tab:{{{2|}}}|Bar}}
{{#tab:{{{2|}}}|Bar}}
|style=color:{{#if:{{{1|}}}|green|red}} }}
|style=color:{{#if:{{{1|}}}|green|red}} }}
<br>
<br>
<br>
=== Toggle box demos ===
==== Plain toggle box ====
<tab openname="Show code" closename="Hide code" collapsed block style="max-width:100%;"><pre style="overflow:auto;">
&lt;tab&gt;This toggle box has no attributes assigned to it.&lt;/tab&gt;
</pre></tab>
<tab>This toggle box has no attributes assigned to it.</tab>
==== Toggle box attributes ====
<tab openname="Show code" closename="Hide code" collapsed block style="max-width:100%;"><pre style="overflow:auto;">
&lt;tab collapsed openname="Toggle" style="font-weight:bold;width:500px;" container="font-style:italic;" title="Example tooltip"&gt;
This toggle box has the following attributes defined:
*<code>collapsed</code> - By default, it is closed.
*<code>openname="Toggle"</code> - The label will show "Toggle" when it can be clicked to open the box. Since no <code>closename</code> attribute is defined, it defaults to "Toggle" too.
*<code>style="font-weight:bold;width:500px;"</code> - The whole toggle box will be bold, and have a width of 500px.
*<code>container="font-style:italic;"</code> - Only the contents of the toggle box will be italic.
*<code>title="Example tooltip"</code> - The tooltip that shows when hovering over this tab is defined via the <code>title</code> attribute.
&lt;/tab&gt;
</pre></tab>
<tab collapsed openname="Toggle" style="font-weight:bold;width:500px;" container="font-style:italic;" title="Example tooltip">
This toggle box has the following attributes defined:
*<code>collapsed</code> - By default, it is closed.
*<code>openname="Toggle"</code> - The label will show "Toggle" when it can be clicked to open the box. Since no <code>closename</code> attribute is defined, it defaults to "Toggle" too.
*<code>style="font-weight:bold;width:500px;"</code> - The whole toggle box will be bold, and have a width of 500px.
*<code>container="font-style:italic;"</code> - Only the contents of the toggle box will be italic.
*<code>title="Example tooltip"</code> - The tooltip that shows when hovering over this tab is defined via the <code>title</code> attribute.
</tab>
==== Inline toggle boxes ====
<tab openname="Show code" closename="Hide code" collapsed block style="max-width:100%;"><pre style="overflow:auto;">
&lt;tab inline collapsed openname="Show" closename="Hide"&gt;
</pre></tab>
Here is an example of an inline toggle box. <tab inline collapsed openname="Show" closename="Hide">This togglebox is <code>inline</code> and <code>collapsed</code></tab> This toggle box has the attributes <code>openname="Show"</code> and <code>closename="Hide"</code> to change the default label text.
<br>
<br>
<br>

2022年3月21日 (月) 10:20時点における版

For example, this will not work:

Foo
Bar




But this will work:

と言うが機能していないようだ。
Foo
Bar




Toggle box demos

Plain toggle box

<tab>This toggle box has no attributes assigned to it.</tab>
This toggle box has no attributes assigned to it.

Toggle box attributes

<tab collapsed openname="Toggle" style="font-weight:bold;width:500px;" container="font-style:italic;" title="Example tooltip">
This toggle box has the following attributes defined:
*<code>collapsed</code> - By default, it is closed.
*<code>openname="Toggle"</code> - The label will show "Toggle" when it can be clicked to open the box. Since no <code>closename</code> attribute is defined, it defaults to "Toggle" too.
*<code>style="font-weight:bold;width:500px;"</code> - The whole toggle box will be bold, and have a width of 500px.
*<code>container="font-style:italic;"</code> - Only the contents of the toggle box will be italic.
*<code>title="Example tooltip"</code> - The tooltip that shows when hovering over this tab is defined via the <code>title</code> attribute.
</tab>

This toggle box has the following attributes defined:

  • collapsed - By default, it is closed.
  • openname="Toggle" - The label will show "Toggle" when it can be clicked to open the box. Since no closename attribute is defined, it defaults to "Toggle" too.
  • style="font-weight:bold;width:500px;" - The whole toggle box will be bold, and have a width of 500px.
  • container="font-style:italic;" - Only the contents of the toggle box will be italic.
  • title="Example tooltip" - The tooltip that shows when hovering over this tab is defined via the title attribute.

Inline toggle boxes

<tab inline collapsed openname="Show" closename="Hide">

Here is an example of an inline toggle box.

This togglebox is inline and collapsed

This toggle box has the attributes openname="Show" and closename="Hide" to change the default label text.