模板:内容盒子/doc:修订间差异
来自BinWiki
< 模板:内容盒子
>棍牧典 创建页面,内容为“ == 描述 == 此模板用于创建一个带有可选标题和自定义样式的通用内容盒子/信息框。 它可以方便地统一wiki中各类信息展示模块的视觉风格,例如“你知道吗”、“热门页面”、公告栏等。 == 用法 == === 基本用法 === <pre> {{内容盒子 |title = 这是一个标题 |content = 这是一些内容。 }} </pre> === 完整参数 === <pre> {{内容盒子 |title = 标题文字 |content = 主要内容…” |
(没有差异)
|
2025年5月9日 (五) 23:13的版本
描述
此模板用于创建一个带有可选标题和自定义样式的通用内容盒子/信息框。 它可以方便地统一wiki中各类信息展示模块的视觉风格,例如“你知道吗”、“热门页面”、公告栏等。
用法
基本用法
{{内容盒子
|title = 这是一个标题
|content = 这是一些内容。
}}
完整参数
{{内容盒子
|title = 标题文字
|content = 主要内容区域
|borderRadius = 边框圆角 (例如 5px, 0px)
|borderColor = 边框颜色 (例如 #CCCCCC, red)
|titlePadding = 标题内边距 (例如 8px 15px)
|titleBgColor = 标题背景色 (例如 #AACCFF)
|titleColor = 标题文字颜色 (例如 #000000, white)
|contentPadding = 内容区域内边距 (例如 10px)
|contentLineHeight = 内容区域行高 (例如 1.6, 2.0)
}}
参数详解
| 参数名 | 描述 | 是否可选 | 默认值 |
|---|---|---|---|
| title | 盒子的标题文字。如果留空或不提供此参数,则不显示标题栏。 | 可选 | (无) |
| content | 盒子的主要内容。可以包含任何Wikitext,包括文本、列表、图片、甚至其他模板。 | 必填 (逻辑上) | ' |
| borderRadius | 盒子的CSS `border-radius` 属性,用于设置边框圆角。 | 可选 | `8px` |
| borderColor | 盒子的CSS `border-color` 属性,用于设置边框颜色。 | 可选 | `#ddd` |
| titlePadding | 标题栏的CSS `padding` 属性。 | 可选 | `8px 8px 8px 15px` |
| titleBgColor | 标题栏的CSS `background-color` 属性。 | 可选 | `#87CEFA` (浅天蓝色) |
| titleColor | 标题栏文字的CSS `color` 属性。 | 可选 | `snow` (雪白色) |
| contentPadding | 内容区域的CSS `padding` 属性。 | 可选 | `10px 15px` |
| contentLineHeight | 内容区域文字的CSS `line-height` 属性。 | 可选 | `1.8` |
示例
示例1: 带标题的基本盒子
{{内容盒子
|title = 温馨提示
|content = 请遵守社区规范,友好交流。
}}
渲染效果:
示例2: 无标题的盒子
{{内容盒子
|content = 这是一段没有标题的重要信息。
}}
渲染效果:
示例3: 自定义样式
{{内容盒子
|title = 特别公告
|content = 本周活动详情请查看 [[活动页面]]。
|borderColor = orange
|borderRadius = 0px
|titleBgColor = #FFA500
|titleColor = black
|contentPadding = 15px 20px
}}
渲染效果:
示例4: 内容为列表 (类似“你知道吗”)
{{内容盒子
|title = Wiki小知识
|content =
* Wiki支持富文本编辑。
* 你可以创建自己的用户页面。
* 模板可以极大地简化重复内容的编写。
|titleBgColor = #6B8E23 <!-- 橄榄绿 -->
|titleColor = white
}}
渲染效果:
注意事项
- 内容参数 (`content`) 可以包含复杂的Wikitext,包括列表、表格、图片甚至其他模板的调用。
- 如果不需要标题,请 不要传入 `title` 参数,或者将其值设为空。
- 为了保持Wiki整体风格的一致性,建议在大多数情况下使用默认样式,仅在确实需要突出显示或区分时进行自定义。
- 此模板依赖于基本的HTML和CSS,在所有现代浏览器中应能正常显示。