快速学习bootstrap前台框架
W3c里的解释
使用bootstrap需要注意事项
1、 在html文件第一行要加上<!doctype html>[s1]
2、 导入bootstrap.min.css文件
3、 导入jquery.js[s2] 与bootstrap.js[s3]
快速学习
1、 登陆http://www.w3cschool.cc/bootstrap
2、 查看里面解说
3、 通过以下实例了解如何学习w3c的bootstrap。(一个警告框的实例)
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap 实例 - 警告(Alerts)</title>
<link href="bootstrap.min.css" rel="stylesheet">
<script src="jquery.min.js"></script>
<script src="bootstrap.min.js"></script>
[s4] </head>
<body>
<div class="alert[s5] alert-success[s6] ">成功!很好地完成了提交。</div>
<div class="alert alert-info[s7] ">信息!请注意这个信息。</div>
<div class="alert alert-danger alert-dismissable">错误!请进行一些更改。
<button class="close[s8] " data-dissmiss[s9] ="alert[s10] ">×</button>
</div>
<div id="myalert" class="alert alert-warning">警告!请不要提交。
<button class="close">×</button>
</div>
<script>
$(".close").click(function(){
$("#myalert").button("close")[s11] [s12] ;
});
$(".close").on[s13] ("close.bs.alert[s14] ", function(){
alert("alert alert alert");
});
</script>
</body>
</html>
格栅系统快速知道
<div class="container[s15] ">
<div class="row[s16] ">
<div class="col-*-*[s17] "></div>
<div class="col-*[s18] -*[s19] "></div>
</div>
<div class="row">...</div>
</div>
<div class="container">....
本人使用网上的模板时,会卡住。这时浏览器左下方会出现连接fonts.googleapis.com提示,说明不能连接到谷歌服务器里。(有点暴力了)
解决方案:删除掉该模板中所有有关fonts.googleapis.com的字段,该字段一般出现在link标签中,把href设置为空即可。例如:
<link href=” fonts.googleapis.com/&*&**(*400,500” />
改成
<link href=”” />
[s1]起到支持w3c的作用
[s2]最好版本1.9的,jquery.min.js也行
[s3]bootstrap.min.js也行
[s4]必须要导入的文件
[s5]申明该div是一个警告框,由此可生成警告框的样式
[s6]声明该警告框的是一个成功的警告框的样式
[s7]同alert-success一样,不过样式做了点修改
[s8]同理是一个css样式,这里是一个关闭的样式,显示一个关闭小图标
[s9]相当于一个事件吧,改变行为,这里是关闭一个警告框
[s10]被关联的对象,要被关闭的对象
[s11]Button的一个方法,关闭class为alert的#myalert的div元素
[s13]不一定要是on,可以是live、bing等
[s14]Botton插件的一个事件
[s15]必须要有
[s16]必须要有,占用一行
[s17]必须要有,这里的值可以是col-md-1、col-md-2、col-xs-1等
[s18]采用什么设备,就选指定的值,比如:如果是平板就用sm即col-sm-1
[s19]是数值:1、2、3到12,最大为12
快速学习bootstrap前台框架的更多相关文章
- 如何快速学习bootstrap
bootstrap中文网http://www.bootcss.com/解决了我所有使用bootstrap的问题,从0开始,下面的全部链接都是该网站的子链接.例子http://v3.bootcss.co ...
- (*)(转)要快速学习SSM框架,你需要一套学习曲线平滑的教程
作者:meepo链接:https://www.zhihu.com/question/57719761/answer/156952139来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载 ...
- 前台框架的选择 EasyUI、DWZ、ligerui
EasyUI1.3.1+MVC4.0+EF5.0 番外篇 关于前台框架的选择 EasyUI.DWZ.ligerui 昨天发了EasyUI1.3.1+MVC4.0+EF5.0实战之一 开篇及布局控件介绍 ...
- 基于springboot+bootstrap+mysql+redis搭建一套完整的权限架构【六】【引入bootstrap前端框架】
https://blog.csdn.net/linzhefeng89/article/details/78752658 基于springboot+bootstrap+mysql+redis搭建一套完整 ...
- Angular快速学习笔记(2) -- 架构
0. angular 与angular js angular 1.0 google改名为Angular js 新版本的,2.0以上的,继续叫angular,但是除了名字还叫angular,已经是一个全 ...
- [源码解析] 深度学习分布式训练框架 horovod (3) --- Horovodrun背后做了什么
[源码解析] 深度学习分布式训练框架 horovod (3) --- Horovodrun背后做了什么 目录 [源码解析] 深度学习分布式训练框架 horovod (3) --- Horovodrun ...
- ASPNET_WEBAPI快速学习02
这部分内容的学习,已经放了大半年时间了,果断补充上,尽早将过去遗留的老技术坑都补上.首先将介绍服务幂等性的概念和相关解决方案,这部分也将是本文的理解难点,由于WebAPI是一种Restful风格服务的 ...
- 快速入门系列--WebAPI--03框架你值得拥有
接下来进入的是俺在ASP.NET学习中最重要的WebAPI部分,在现在流行的互联网场景下,WebAPI可以和HTML5.单页应用程序SPA等技术和理念很好的结合在一起.所谓ASP.NET WebAPI ...
- Dapper快速学习
Dapper快速学习 我们都知道ORM全称叫做Object Relationship Mapper,也就是可以用object来map我们的db,而且市面上的orm框架有很多,其中有一个框架 叫做dap ...
随机推荐
- 一款非常炫酷的jQuery动态随机背景滚动特效
一款非常炫酷的jQuery动态随机背景滚动特效 图片背景会不停息的滚动,带有那种漂浮的视觉效果,小圈圈飘动. 更好的是还兼容IE6浏览器,大伙可以好好研究研究. 适用浏览器:IE6.IE7.IE8.3 ...
- html设置360兼容/极速模式
由于众所周知的情况,国内的主流浏览器都是双核浏览器:基于Webkit内核用于常用网站的高速浏览.基于IE的内核用于兼容网银.旧版网站.以360的几款浏览器为例,我们优先通过Webkit内核渲染主流的网 ...
- 演出排期JavaScript
<script language="JavaScript" type="text/javascript"> var diarydays=" ...
- 使用Animation实现Button的透明度Opacity变化
接着之前的使Button的Content变化的例子,这里给出使Button的透明度变化的写法. 前台写法: 后台写法: 效果图:Opacity的值正在变小 效果还不错,前台是用Blend生成的,后台的 ...
- WPF中实现Button.Content变化的简易动画
项目中曾要这样的需求——输入法的切换,要求从English切换到简体中文的时候,Button的Content先从English变成空白,再从空白变成简体中文, 而不是直接从English变成简体中文. ...
- Oracle RAC 11gR2 修改本地及SCAN监听端口
昨天同事说有套RAC集群客户要求修改数据库的监听端口,在处理的过程中,发现网上的相关资料都不是很全面,所以整理了一下,希望给其他有需要的朋友提供一点有利的参考资料.具体操作过程如下: ...
- Scrumworks乱码
要搞敏捷,先找个工具.选了scrumworks5.1.安装完后发现录入汉字乱码. 环境: server:CentOS linux db:mysql5.0 appserver:jboss(scrumwo ...
- 升级Mac osx 10.10 后安装php 的mcrypt extension
昨天折腾到凌晨四点多,今天又到这个点,终于成功了,心情比较复杂,先记录一下,改日再整理,此刻头昏脑胀,只想蒙头大睡. 发的问题,还没人回复,自己找到答案了,英语比较蹩脚,凑合看.. http://st ...
- 序列化form表单内容为json对象
SourceCode: ; (function ($) { $.fn.extend({ serializeJson: function () { var json = {}; $(this.seria ...
- Jquery post 传递数组给asp.net mvc方法
以批量删除数据为例 做批量删除会需要传递要删除的数据ID数组 function RemoveLog(){ var postModel=[]; //遍历复选框获取要删除的数据ID 存放到数组中 $( ...