Foundation 提醒框教程

2024-11-06 17:14:07

1、提醒框可以使用.alert-box类创建, 可以添加可选的类:.secondary,.success,.info,.warning或.alert:实例<divdata-alert class="alert-box"> This is a default alert box.</div><divdata-alert class="alert-box secondary"> This is a secondary alert box.</div><divdata-alert class="alert-box success"><strong>Success!</strong>This alert box indicates a successful or positive action.</div><divdata-alert class="alert-box info"><strong>Info!</strong>This alert box indicates a neutral informative change or action.</div><divdata-alert class="alert-box warning"><strong>Warning!</strong>This alert box indicates a warning that might need attention.</div><divdata-alert class="alert-box alert"><strong>Alert!</strong>This alert box indicates a dangerous or potentially negative action.</div>提醒框的宽度为容器的 100%。

Foundation 提醒框教程

3、关闭提醒框要关闭提醒框,可以在连接或按钮元素上添加class="close"类,并初始化 Foundation JS:实例<divdata-alert class="alert-box"> This is a default alert box with closing functionality.<ahref="#"class="close">&times;</a></div><script>// Initialize Foundation JS For Functionality$(document).ready(function() { $(document).foundation();})</script>&times; (×) 是一个 HTML 字符实体表示一个关闭按钮的图标,而不是字母 "x"

Foundation 提醒框教程
相关推荐
猜你喜欢