bootstrap模态框远程示例代码分享


Posted in Javascript onMay 22, 2017

本文实例为大家分享了bootstrap模态框远程的具体代码,供大家参考,具体内容如下

<!DOCTYPE html> 
<html lang="zh-CN"> 
<head> 
 <meta charset="utf-8"> 
 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
 <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> 
 <title>XXX</title> 
 <link rel="stylesheet" href="lib/bootstrap/css/bootstrap.css"> 
 <link rel="stylesheet" href="css/main.css"> 
 <!--[if lt IE 9]> 
 <script src="lib/html5shiv/html5shiv.min.js"></script> 
 <script src="lib/respond/respond.min.js"></script> 
 <![endif]--> 
</head> 
<body> 
<!--通过按钮可以加载模态框内容,一定要加上头部和底部--> 
   <div class="modal-header"> 
    <!--关闭按钮--> 
    <button class="close" data-dismiss="modal"><!--可以关闭模态框--> 
     <span>×</span> 
    </button> 
    <!--头部标题--> 
    <h4 class="modal-title">远程登录</h4> 
   </div> 
   <div class="modal-body"> 
    <!--<p>暂时无法注册</p>--> 
    <div class="container-fluid"><!--在模态框主体部分还可以加入流体的栅格系统,一定是流体--> 
     <div class="row"> 
      <div class="col-lg-4 col-md-4 col-sm-6">haha</div> 
      <div class="col-lg-4 col-md-4 col-sm-6">hehe</div> 
      <div class="col-lg-4 col-md-4 col-sm-6">heihei</div> 
     </div> 
    </div> 
   </div> 
   <div class="modal-footer"> 
    <button class="btn btn-default">远程</button> 
    <button class="btn btn-primary">远程</button> 
   </div> 
<script src="lib/jquery/jquery.js"></script> 
<script src="lib/bootstrap/js/bootstrap.js"></script> 
<script src="js/main.js"></script> 
</body> 
 
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
背景图跟随鼠标移动的Mootools插件实现代码
Dec 12 Javascript
js限制文本框的输入内容代码分享(3类)
Aug 20 Javascript
jQuery旋转木马式幻灯片轮播特效
Dec 04 Javascript
JavaScript实现设计模式中的单例模式的一些技巧总结
May 17 Javascript
基于JS实现导航条之调用网页助手小精灵的方法
Jun 17 Javascript
Bootstrap基本插件学习笔记之标签切换(17)
Dec 08 Javascript
JS字符串统计操作示例【遍历,截取,输出,计算】
Mar 27 Javascript
vue2.0 和 animate.css的结合使用
Dec 12 Javascript
javascript高仿热血传奇游戏实现代码
Feb 22 Javascript
jQuery动态添加li标签并添加属性和绑定事件方法
Feb 24 jQuery
关于RxJS Subject的学习笔记
Dec 05 Javascript
微信用户访问小程序的登录过程详解
Sep 20 Javascript
bootstrap手风琴折叠示例代码分享
May 22 #Javascript
移动端手指放大缩小插件与js源码
May 22 #Javascript
jQuery滑动到底部加载下一页数据的实例代码
May 22 #jQuery
详解Angular路由 ng-route和ui-router的区别
May 22 #Javascript
Angular中$broadcast和$emit的使用方法详解
May 22 #Javascript
详解从angular-cli:1.0.0-beta.28.3升级到@angular/cli:1.0.0
May 22 #Javascript
详解AngularJS1.6版本中ui-router路由中/#!/的解决方法
May 22 #Javascript
You might like
德生S2000电路分析
2021/03/02 无线电
造就帕卡马拉的帕卡斯是怎么被发现的
2021/03/03 咖啡文化
PHP EOT定界符的使用详解
2008/09/30 PHP
php实现的验证码文件类实例
2015/06/18 PHP
windows下apache搭建php开发环境
2015/08/27 PHP
PHP7常量数组用法分析
2016/09/26 PHP
php基于闭包实现函数的自调用(递归)实例分析
2016/11/11 PHP
php 遍历目录,生成目录下每个文件的md5值并写入到结果文件中
2016/12/12 PHP
phpmyadmin下载、安装、配置教程
2017/05/16 PHP
tp5.1 实现setInc字段自动加1
2019/10/18 PHP
Javascript 篱式条件判断
2008/08/22 Javascript
关于juqery radio写法的兼容性问题(新老版本jquery)
2010/06/14 Javascript
一个很有趣3D球状标签云兼容IE8
2014/08/22 Javascript
jquery判断单选按钮radio是否选中的方法
2015/05/05 Javascript
微信小程序多列选择器range-key使用详解
2020/03/30 Javascript
js实现各浏览器全屏代码实例
2018/07/03 Javascript
vue中将html字符串转换成html后遇到的问题小结
2018/12/10 Javascript
vue实现从外部修改组件内部的变量的值
2020/07/30 Javascript
python生成指定尺寸缩略图的示例
2014/05/07 Python
举例讲解Python中装饰器的用法
2015/04/27 Python
各个系统下的Python解释器相关安装方法
2015/10/12 Python
Python3爬虫学习之将爬取的信息保存到本地的方法详解
2018/12/12 Python
python爬虫 urllib模块url编码处理详解
2019/08/20 Python
YOOX美国官方网站:全球著名的多品牌时尚网络概念店
2016/09/11 全球购物
设计师家具购买和委托在线市场:Viyet
2016/11/16 全球购物
美国社交购物市场:MassGenie
2019/02/18 全球购物
英国莱斯特松木橡木家具网上商店:Choice Furniture Superstore
2019/07/05 全球购物
Madewell澳大利亚官方网站:美国休闲服饰品牌
2019/07/18 全球购物
英国手工制作的现代与经典的沙发和床:Love Your Home
2020/09/26 全球购物
大学四年职业生涯规划书范文
2014/01/02 职场文书
工程售后服务方案
2014/06/08 职场文书
区政府领导班子个人对照检查材料
2014/09/25 职场文书
小学班主任事迹材料
2014/12/17 职场文书
企业工会工作总结2015
2015/05/13 职场文书
mysql5.7使用binlog 恢复数据的方法
2021/06/03 MySQL
Nginx缓存设置案例详解
2021/09/15 Servers