Foundation 模态框
模态框是一个显示在页面头部的弹窗。
我们可以在容器元素上(如 如果你希望在点击模态框之外的区域来关闭模态框。你可以在模态框的关闭按钮 注意:滑块需要使用 JavaScript。所以你需要初始化 oundation JS: 可以在模态框容器上添加以下类来设置模态框的大小： 注意:在平板、笔记本、PC 电脑上默认为 80% 宽度，在小屏幕设备上是 100% 宽度。 使用以下类来修改模态框大小: 点击 "运行实例" 按钮查看在线实例 你可以在模态框内嵌入模态框，可以在第一个模态框上添加新的触发按钮。你必须为内嵌模态框设置一个唯一的 id： 第二个模态框会取代第一个模态框。如果你希望在打开第二个模态框时，不关闭第一个模态框。可以在第二个模态框上添加.reveal-modal类和data-reveal属性来添加模态框。我们可以在任何元素上使用data-reveal-id="id"属性阿里打开模态框。id必须与容器 id 一致(实例为 "myModal")。
标签上添加.close-reveal-modal类来实现。
模态框大小
.tiny: 30% 宽度.small: 40% 宽度.medium: 60% 宽度.large: 70% 宽度.xlarge: 95% 宽度.full: 100% 宽度和高度实例
模态框大小
.tiny: 设置宽度为 30%.small: 设置宽度为 40%.medium: 设置宽度为 60%.large: 设置宽度为 70%.xlarge: 设置宽度为 95%.full: 设置宽度喝高度为 100%
运行实例 »
内嵌模态框
data-options="multiple_opened:true;"属性：
教程导航