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 相关文章推荐
jquery 子窗口操作父窗口的代码
Sep 21 Javascript
理解Javascript_09_Function与Object
Oct 16 Javascript
jQuery Ajax 仿AjaxPro.Utility.RegisterTypeForAjax辅助方法
Sep 27 Javascript
jquery自动将form表单封装成json的具体实现
Mar 17 Javascript
详解JavaScript的流程控制语句
Nov 30 Javascript
JavaScript DOM 对象深入了解
Jul 20 Javascript
浅谈实现vue2.0响应式的基本思路
Feb 13 Javascript
详解webpack-dev-server 设置反向代理解决跨域问题
Apr 18 Javascript
浅谈angularJS2中的界面跳转方法
Aug 31 Javascript
微信小程序实现复选框效果
Dec 28 Javascript
Vue的Options用法说明
Aug 14 Javascript
JavaScript的Set数据结构详解
Feb 18 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
FirePHP 推荐一款PHP调试工具
2011/04/23 PHP
Yii不依赖Model的表单生成器用法实例
2014/12/04 PHP
详解WordPress中提醒安装插件以及隐藏插件的功能实现
2015/12/25 PHP
PHP检查网站是否宕机的方法示例
2017/07/24 PHP
Laravel框架模板加载,分配变量及简单路由功能示例
2018/06/11 PHP
PHP 进程池与轮询调度算法实现多任务的示例代码
2019/11/26 PHP
laravel框架中控制器的创建和使用方法分析
2019/11/23 PHP
Javascript前端UI框架Kit使用指南之kitjs的对话框组件
2014/11/28 Javascript
实例分析javascript中的call()和apply()方法
2014/11/28 Javascript
javascript定义变量时加var与不加var的区别
2014/12/22 Javascript
使用jquery/js获取iframe父子级、同级获取元素的方法
2016/08/05 Javascript
使用JS轻松实现ionic调用键盘搜索功能(超实用)
2016/09/06 Javascript
jQuery EasyUI tree 使用拖拽时遇到的错误小结
2016/10/10 Javascript
chorme 浏览器记住密码后input黄色背景处理方法(两种)
2017/11/22 Javascript
谈谈vue中mixin的一点理解
2017/12/12 Javascript
微信小程序下拉菜单效果的实例代码
2019/05/14 Javascript
详解JavaScript之ES5的继承
2020/07/08 Javascript
老生常谈Python进阶之装饰器
2017/05/11 Python
Python3安装Pillow与PIL的方法
2019/04/03 Python
python Tensor和Array对比分析
2020/01/08 Python
Python使用Socket实现简单聊天程序
2020/02/28 Python
SIDESTEP荷兰:在线购买鞋子
2019/11/18 全球购物
巴西箱包、背包、钱包和旅行配件购物网站:Inovathi
2019/12/14 全球购物
毕业生就业推荐信范文
2013/12/01 职场文书
股权转让协议书
2014/04/12 职场文书
演讲稿格式
2014/04/30 职场文书
检察机关个人对照检查材料
2014/09/15 职场文书
内勤岗位职责范本
2015/04/13 职场文书
毕业生爱心捐书倡议书
2015/04/27 职场文书
活动总结书怎么写
2015/05/11 职场文书
大学优秀学生主要事迹材料
2015/11/04 职场文书
2016年度继续教育学习心得体会
2016/01/19 职场文书
pytorch中的numel函数用法说明
2021/05/13 Python
Python OpenCV实现传统图片格式与base64转换
2021/06/13 Python
openstack云计算keystone组件工作介绍
2022/04/20 Servers
Spring IOC容器Bean的作用域及生命周期实例
2022/05/30 Java/Android