Notice - 通知

notice - 通知简码显示各种类型的通知,具有可调整的颜色\标题\图标,以帮助您构建页面.

这是一个通知标题

这是通知的文本内容

用法

当示例使用带有命名参数的短码时,您也可以自由使用位置代码,或者也可以从您自己的部分调用此简码.

{{% notice style="primary" title="这是一个通知标题" icon="bell" %}}
这是通知的文本内容
{{% /notice %}}
{{% notice primary "这是一个通知标题" "bell" %}}
这是通知的文本内容
{{% /notice %}}
{{ partial "shortcodes/notice.html" (dict
  "page"  .
  "style" "primary"
  "title" "这是一个通知标题"
  "icon" "bell"
  "content" "这是通知的文本内容"
)}}

参数

名字 位置 默认值 注释
style 1 default 用于框的样式方案.

- 按严重性: info, note, tip, warning
- 按品牌颜色: primary, secondary, accent
- 按颜色: blue, green, grey, orange, red
- 按特殊颜色: default, transparent, code
color 请参阅注释 要使用的 CSS 颜色值. 如果未设置,则所选颜色取决于style.任何给定值都将覆盖默认值.

- 对于严重性样式:严重性匹配的颜色
- 对于所有其他样式:相应的颜色
title 2 请参阅注释 框标题的任意文本.根据 style,可能会有一个默认标题.任何给定值都将覆盖默认值.

- 对于严重性样式:严重性的匹配标题
- 适用于所有其他样式: <empty>

如果不希望严重性样式的标题,则必须将此参数设置为 " " (有空格的非空字符串)
icon 3 请参阅注释 字体真棒图标名称 设置为标题的左侧.根据 style,可能会有一个默认图标.任何给定值都将覆盖默认值.

- 对于严重性样式:严重性的一个很好的匹配图标
- 适用于所有其他样式: <empty>

如果不希望严重性样式没有图标,则必须将此参数设置为" " (有空格的非空字符串)
<content> <empty> 要在框中显示的任意文本.

示例

按严重性

示例:带标记的信息
{{% notice style="info" %}}
**info**通知

您可以添加标准的Markdown语法:

- 多个段落
- 项目符号列表
- _斜体_, **粗体**  even **_粗斜体_** 文本
- [链接](https://example.com)
- .

```plaintext
...甚至源代码
```

> 可能性是无穷无尽的(几乎 - 包括其他短代码可能有效,也可能无效)
{{% /notice %}}

输出:

信息

info信息通知

您可以添加标准的Markdown语法:

  • 多个段落
  • 项目符号列表
  • 斜体, 粗体 和 even 粗斜体 文本
  • 连接
  • 等.
...甚至源代码

可能性是无穷无尽的(几乎 - 包括其他短代码可能有效,也可能无效)


按样式

示例:通知通知
{{% notice style="note" %}}
**note**通知通知
{{% /notice %}}

输出:

注释

note通知通知

示例:提示通知
{{% notice style="tip" %}}
**tip**提示通知
{{% /notice %}}

输出:

提示

tip提示通知

示例:警告通知
{{% notice style="warning" %}}
**warning**警告通知
{{% /notice %}}

输出:

警告

warning警告通知


示例:带有非默认标题和图标的警告通知
{{% notice style="warning" title="Here are dragons" icon="dragon" %}}
**warning**警告通知
{{% /notice %}}

输出:

Here are dragons

warning警告通知

示例:没有标题和图标的警告通知
{{% notice style="warning" title=" " icon=" " %}}
没有标题和图标的警告通知**warning**
{{% /notice %}}

输出:

详情

没有标题和图标的警告通知warning


按品牌颜色

示例:仅具有标题的主要内容的通知
{{% notice style="primary" title="Primary" %}}
**Primary**主要通知
{{% /notice %}}

输出:

Primary

Primary主要通知

示例:仅带图标的次要的通知
{{% notice style="secondary" icon="stopwatch" %}}
**secondary**次要通知
{{% /notice %}}

输出:

详情

secondary次要通知

示例:重音通知
{{% notice style="accent" %}}
**accent**重音通知
{{% /notice %}}

输出:

详情

accent重音通知


按颜色

示例:没有标题和图标的蓝色通知
{{% notice style="blue" %}}
**blue**蓝色通知
{{% /notice %}}

输出:

详情

blue蓝色通知

示例:绿色,仅带标题的通知
{{% notice style="green" title="Green" %}}
**green**绿色通知
{{% /notice %}}

输出:

Green

green绿色通知

示例:灰色,仅带图标的通知
{{% notice style="grey" icon="bug" %}}
**grey**灰色通知
{{% /notice %}}

输出:

详情

grey灰色通知

示例:橙色与标题和图标的通知
{{% notice style="orange" title="Orange" icon="bug" %}}
**orange**橙色通知
{{% /notice %}}

输出:

Orange

orange橙色通知

示例:没有标题和红色图标的通知
{{% notice style="red" %}}
**red**红色通知
{{% /notice %}}

输出:

详情

red红色通知


按特殊颜色

示例:带位置参数的默认值的通知
{{% notice default "注意此事项!" "bell" %}}
一些严肃的信息.
{{% /notice %}}

输出:

注意此事项!

一些严肃的信息.

示例:透明,带标题和图标的通知
{{% notice style="transparent" title="注意此事项!" icon="bell" %}}
一些严肃的信息.
{{% /notice %}}

输出:

注意此事项!

一些严肃的信息.

示例:具有用户定义的颜色,字体真棒品牌图标和Markdown标题的通知
{{% notice color="fuchsia" title="**Hugo**" icon="fab fa-hackerrank" %}}
具有用户定义的颜色,字体真棒品牌图标和Markdown标题的通知
{{% /notice %}}

输出:

Hugo

具有用户定义的颜色,字体真棒品牌图标和Markdown标题的通知