更多操作
无编辑摘要 |
无编辑摘要 |
||
第91行: | 第91行: | ||
</nowiki></pre> | </nowiki></pre> | ||
== 效果展示 == | == 效果展示 == | ||
{{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 | |||
}} | |||
{{#widget:ProductCard | {{#widget:ProductCard | ||
| themeColor = "#36a5e8" | | themeColor = "#36a5e8" |
2024年7月19日 (五) 00:13的版本
参数说明
- themeColor 主题颜色, 默认值: #36a5e8
- images 图片数据, 必填
- title 名称, 必填
- src 图片链接, 必填
- chipsTitle 标签数据标题, 选填
- chips 标签数据, 选填
- name 名称, chips有值时必填
- url 跳转链接, 选填
- kvDatasTitle K-V数据标题, 选填
- kvDatas K-V数据, 选填
- key 名称, 必填
- value 值, 必填
- url 跳转链接, 选填
- liDataTitle 列表数据标题, 选填
- liDatas 列表数据, 选填
- name 名称, 必填
- url 跳转链接, 必填
用法
{{#widget:ProductCard | themeColor = "#36a5e8" | images = [ { title: "CM4核心板", src: "https://www.waveshare.net/w/thumb.php?f=Compute-Module-4-1.jpg&width=360", }, { title: "官方底板", src: "https://www.waveshare.net/w/thumb.php?f=Compute-Module-4-IO-Board-2.jpg&width=360", }, { title: "官方底板外", src: "https://www.waveshare.net/w/thumb.php?f=CM4-IO-BOARD-CASE-A-2.jpg&width=360", }, ] | chipsTitle = "板载接口" | chips = [ { name: "DIS", url: "https://www.waveshare.net/wiki/%E5%88%86%E7%B1%BB:DSI%E6%8E%A5%E5%8F%A3", }, { name: "CSI", url: "" }, { name: "HDMI", url: "" }, { name: "USB2.0", url: "" }, { name: "I2C", url: "" }, { name: "PECI", url: "https://www.waveshare.net/w/index.php?title=%E5%88%86%E7%B1%BB:PCIE%E6%8E%A5%E5%8F%A3&action=edit&redlink=1", }, { name: "SPI", url: "https://www.waveshare.net/wiki/%E5%88%86%E7%B1%BB:SPI%E6%8E%A5%E5%8F%A3", }, { name: "UART", url: "" }, ] | kvDatasTitle = "功能简介" | kvDatas = [ { key: "特性", value: "1200万像素", }, { key: "模组", value: "IMX708", }, { key: "视场角", value: "75°/120°", url: "", }, { key: "接口", value: "CSI", url: "https://www.waveshare.net/wiki/%E5%88%86%E7%B1%BB:CSI%E6%8E%A5%E5%8F%A3", }, ] | liDataTitle = "相关产品" | liDatas = [ { name: "Raspberry Pi开发板", url: "https://www.waveshare.net/wiki/%E5%88%86%E7%B1%BB:Raspberry_Pi%E5%BC%80%E5%8F%91%E6%9D%BF", }, { name: "Pioneer600", url: "https://www.waveshare.net/wiki/Pioneer600", }, ] }}
效果展示
显示一个简单的黑色标题,背景透明,没有边框和下划线
有浅蓝色背景和深蓝色文字,仍使用默认的 h1 标签
使用 h2 标签显示绿色标题,背景透明, 和2px粗的下划线。
有黄色背景、黑色文字、5px 宽的左侧边框和2px粗的下划线。
用 h3 标签,具有灰色背景、深灰色文字、10px 宽的左边框。