打开/关闭菜单
打开/关闭个人菜单
未登录
未登录用户的IP地址会在进行任意编辑后公开展示。

Template:StyledHeader:修订间差异

模板页面
无编辑摘要
Root留言 | 贡献
 
(未显示1个用户的82个中间版本)
第4行: 第4行:
* color: 标题文字颜色(如 red、blue),默认为 black。
* color: 标题文字颜色(如 red、blue),默认为 black。
* bgcolor: 标题背景颜色(如 yellow、lightgray),默认为透明。
* bgcolor: 标题背景颜色(如 yellow、lightgray),默认为透明。
* header: 设置标题标签(如 h1、h2、h3),默认为 h3
* header: 设置标题标签(如 h1、h2、h3),默认为 h1
* border-width: 左侧边框的宽度(如 2px),默认为 0。
* border-left: 左侧边框的宽度(如 2px),默认为 0。
* underline-width: 下划线的粗细(如 1px),默认为 0,若未设置则无下划线。
* border-bottom: 下划线的粗细(如 1px),默认为 0,若未设置则无下划线。
== 用法 ==
== 用法 ==
<pre><nowiki>
<pre><nowiki>
{{StyledHeader
{{StyledHeader
| text = 用 h1 标签,色背景、深灰色文字、10px 宽的左边框和2px粗的下划线。
| text = 显示一个简单的黑色标题,背景透明,没有边框和下划线
| header = h1
}}
{{StyledHeader
| text = 有浅蓝色背景和深蓝色文字,仍使默认的 h1 标签
| bgcolor = lightblue
| color = darkblue
}}
{{StyledHeader
| text = 使用 h2 标签显示绿色标题背景透明, 和2px粗的下划线。
| header = h2
| color = green
| border-bottom = 2px
}}
{{StyledHeader
| text = 色背景、色文字、5px 宽的左边框和2px粗的下划线
| bgcolor = yellow
| color = black
| border-left = 5px
| border-bottom = 2px
}}
{{StyledHeader
| text = 用 h3 标签,具有灰色背景、深灰色文字、10px 宽的左边框
| header = h3
| bgcolor = #f0f0f0
| bgcolor = #f0f0f0
| color = #333
| color = #333
| border-width = 10px
| border-left = 10px
| underline-width = 2px
}}
}}
</nowiki></pre>
</nowiki></pre>
第31行: 第51行:
| header = h2
| header = h2
| color = green
| color = green
| underline-width = 2px
| border-bottom = 2px
}}
}}
{{StyledHeader
{{StyledHeader
第37行: 第57行:
| bgcolor = yellow
| bgcolor = yellow
| color = black
| color = black
| border-width = 5px
| border-left = 5px
| underline-width = 2px
| border-bottom = 2px
}}
}}
{{StyledHeader
{{StyledHeader
第45行: 第65行:
| bgcolor = #f0f0f0
| bgcolor = #f0f0f0
| color = #333
| color = #333
| border-width = 10px
| border-left = 10px
}}
 
{{StyledHeader
| text = 标题测试
| header = h1
| color = blue
}}
{{StyledHeader
| text = 一级子标题-产品参数
| header = h2
| color = blue
| border-left = 10px
}}
*测试行1
**测试内行11
*测试行2
**测试内行22
 
{{StyledHeader
| text = 一级子标题-产品说明
| header = h2
| color = blue
| border-left = 10px
}}
{{StyledHeader
| text = 二级子标题
| header = h4
| color = blue
| border-bottom= 2px
}}
*测试行1
**测试内行11
*测试行2
**测试内行22
{{StyledHeader
| text = 二级子标题
| header = h4
| color = blue
| border-bottom= 2px
}}
}}
*测试行1
**测试内行11
*测试行2
**测试内行22
</noinclude>
</noinclude>
<includeonly>
<includeonly><onlyinclude>{{#invoke:StyledHeader|customStyles}}</onlyinclude></includeonly>
<onlyinclude>
<div style="background-color: {{{bgcolor|transparent}}};
            border-left: {{{border-width|0}}} solid {{{color|transparent}}};
            padding: 10px;
            margin-bottom: 5px;">
  <{{{header|h1}}} style="margin: 0;
              color: {{{color|black}}};
              border-bottom: {{{#if:{{{underline-width|}}}|{{{underline-width}}} solid {{{color|black}}}|none}}};">
    {{{text}}}
  </{{{header|h1}}}>
</div>
</onlyinclude>
</includeonly>

2024年7月23日 (二) 23:58的最新版本

参数说明

  • text: 要显示的标题文本。
  • color: 标题文字颜色(如 red、blue),默认为 black。
  • bgcolor: 标题背景颜色(如 yellow、lightgray),默认为透明。
  • header: 设置标题标签(如 h1、h2、h3),默认为 h1。
  • border-left: 左侧边框的宽度(如 2px),默认为 0。
  • border-bottom: 下划线的粗细(如 1px),默认为 0,若未设置则无下划线。

用法

{{StyledHeader
| text = 显示一个简单的黑色标题,背景透明,没有边框和下划线
}}
{{StyledHeader
| text = 有浅蓝色背景和深蓝色文字,仍使用默认的 h1 标签
| bgcolor = lightblue
| color = darkblue
}}
{{StyledHeader
| text = 使用 h2 标签显示绿色标题,背景透明, 和2px粗的下划线。
| header = h2
| color = green
| border-bottom = 2px
}}
{{StyledHeader
| text = 有黄色背景、黑色文字、5px 宽的左侧边框和2px粗的下划线。
| bgcolor = yellow
| color = black
| border-left = 5px
| border-bottom = 2px
}}
{{StyledHeader
| text = 用 h3 标签,具有灰色背景、深灰色文字、10px 宽的左边框。
| header = h3
| bgcolor = #f0f0f0
| color = #333
| border-left = 10px
}}

效果展示

显示一个简单的黑色标题,背景透明,没有边框和下划线

有浅蓝色背景和深蓝色文字,仍使用默认的 h1 标签

使用 h2 标签显示绿色标题,背景透明, 和2px粗的下划线。

有黄色背景、黑色文字、5px 宽的左侧边框和2px粗的下划线。

用 h3 标签,具有灰色背景、深灰色文字、10px 宽的左边框。

标题测试

一级子标题-产品参数

  • 测试行1
    • 测试内行11
  • 测试行2
    • 测试内行22

一级子标题-产品说明

二级子标题

  • 测试行1
    • 测试内行11
  • 测试行2
    • 测试内行22

二级子标题

  • 测试行1
    • 测试内行11
  • 测试行2
    • 测试内行22