W3.CSS 警告框
w3-panel 类是显示所有类型警告框的完美类。
危险!
红色通常表示危险或负面情况。
警告框通常使用醒目的颜色显示。
危险!
红色通常表示危险或负面情况。
显示警告
警告!
黄色通常表示需要注意的警告。
警告!
黄色通常表示需要注意的警告。
显示成功
成功!
绿色通常表示成功或积极的事物。
成功!
绿色通常表示成功或积极的事物。
显示信息
信息!
蓝色通常表示中性的信息性更改或操作。
信息!
蓝色通常表示中性的信息性更改或操作。
使用容器
w3-container 类也可以用来显示警告框。
所有颜色的警告框
警告框通常以特殊颜色显示,但任何颜色都可以使用。
危险!
红色通常表示危险或负面情况。
危险!
红色通常表示危险或负面情况。
危险!
红色通常表示危险或负面情况。
危险!
红色通常表示危险或负面情况。
危险!
红色通常表示危险或负面情况。
关闭警报
要关闭警告框,请点击右上角的 X。
危险!
红色通常表示危险或负面情况。
要创建关闭警告框的 X,请添加一个带有 w3-button 类和 onclick 事件的 <span> 元素。
示例
<span onclick="this.parentElement.style.display='none'"
class="w3-button w3-display-topright">×</span>
自己试试 »
提示: HTML 实体 × 是关闭按钮的首选图标(而不是字母“X”)。
圆角警告框
如果您想要圆角,请使用 w3-round 类。
成功!
这里使用了 w3-round。
成功!
这里使用了 w3-round-large。
成功!
这里使用了 w3-round-xxlarge。
作为卡片的警告框
如果您想让警告框显示为卡片,请使用 w3-card 类。
警告!
黄色通常表示需要注意的事情。