Bootstrap中如何应用弹出框

 时间:2024-10-15 09:50:54

1、首先我们在html中引入我们需要的文件,如下图所示,bootstrap的库文件,jquery的

Bootstrap中如何应用弹出框

2、然后在我们的body区域添加一个Button按钮,如下图所示

Bootstrap中如何应用弹出框

3、然后给这个button添加一个data-toggle属性,如下图所示,值为popover

Bootstrap中如何应用弹出框

4、接下来就是给弹出框起一个标题了,如下图所示

Bootstrap中如何应用弹出框

5、然后设置弹出框的文本内容,以及显示的位置区域,如下图所示

Bootstrap中如何应用弹出框

6、最后我们页面初始化的时候,将这个按钮也初始化,调用的是popover函数,如下图所示

Bootstrap中如何应用弹出框

7、接下来,运行程序,你会看到如下图所示的效果。当然如果你想显示在上面,右边都是可以的

Bootstrap中如何应用弹出框
  • sqlserver将数据库生成sql语句文件
  • JS绑定click事件不生效
  • Android Studio如何显示框架检测
  • 如何使用Visio2010创建电气系统图?
  • 在Typora中怎么表示求和符号?
  • 热门搜索
    红红的太阳像什么 六月六是什么节日 1921年属什么生肖 舌苔发黄是什么原因 menu是什么意思 股票xd开头什么意思 重阳节又叫什么节 下巴长痘是什么原因 1987年属什么生肖 618是什么节日