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] ">&times;</button>
</div>
<div id="myalert" class="alert alert-warning">警告！请不要提交。
<button class="close">&times;</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元素

[s12]等价于data-dissmiss [s12]="alert [s12]"，不过这里data-dissmiss [s12]="alert [s12]"要添加到元素里

[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前台框架的更多相关文章

  1. 如何快速学习bootstrap

    bootstrap中文网http://www.bootcss.com/解决了我所有使用bootstrap的问题,从0开始,下面的全部链接都是该网站的子链接.例子http://v3.bootcss.co ...

  2. （*）（转）要快速学习SSM框架，你需要一套学习曲线平滑的教程

    作者:meepo链接:https://www.zhihu.com/question/57719761/answer/156952139来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载 ...

  3. 前台框架的选择 EasyUI、DWZ、ligerui

    EasyUI1.3.1+MVC4.0+EF5.0 番外篇 关于前台框架的选择 EasyUI.DWZ.ligerui 昨天发了EasyUI1.3.1+MVC4.0+EF5.0实战之一 开篇及布局控件介绍 ...

  4. 基于springboot+bootstrap+mysql+redis搭建一套完整的权限架构【六】【引入bootstrap前端框架】

    https://blog.csdn.net/linzhefeng89/article/details/78752658 基于springboot+bootstrap+mysql+redis搭建一套完整 ...

  5. Angular快速学习笔记（2） -- 架构

    0. angular 与angular js angular 1.0 google改名为Angular js 新版本的,2.0以上的,继续叫angular,但是除了名字还叫angular,已经是一个全 ...

  6. [源码解析] 深度学习分布式训练框架 horovod (3) --- Horovodrun背后做了什么

    [源码解析] 深度学习分布式训练框架 horovod (3) --- Horovodrun背后做了什么 目录 [源码解析] 深度学习分布式训练框架 horovod (3) --- Horovodrun ...

  7. ASPNET_WEBAPI快速学习02

    这部分内容的学习,已经放了大半年时间了,果断补充上,尽早将过去遗留的老技术坑都补上.首先将介绍服务幂等性的概念和相关解决方案,这部分也将是本文的理解难点,由于WebAPI是一种Restful风格服务的 ...

  8. 快速入门系列--WebAPI--03框架你值得拥有

    接下来进入的是俺在ASP.NET学习中最重要的WebAPI部分,在现在流行的互联网场景下,WebAPI可以和HTML5.单页应用程序SPA等技术和理念很好的结合在一起.所谓ASP.NET WebAPI ...

  9. Dapper快速学习

    Dapper快速学习 我们都知道ORM全称叫做Object Relationship Mapper,也就是可以用object来map我们的db,而且市面上的orm框架有很多,其中有一个框架 叫做dap ...

随机推荐

  1. php读取excel文件的实例代码

    php读取excel文件的实例代码. 代码: <?php /** * php读取excel文件 * by www.jbxue.com */ $this->loadexcel();//半酣p ...

  2. 优化C++程序编译效率的一些方法

    优化是一件非常重要的事情.作为一个程序设计者,你肯定希望自己的程序既小又快.DOS时代的许多书中都提到,“某某编译器能够生成非常紧凑的代码”,换言之,编译器会为你把代码尽可能地缩减,如果你能够正确地使 ...

  3. hadoop的核心思想

    hadoop的核心思想 1.1.1. hadoop的核心思想 Hadoop包括两大核心,分布式存储系统和分布式计算系统. 1.1.1.1. 分布式存储 为什么数据需要存储在分布式的系统中哪,难道单一的 ...

  4. mac os快捷键

    选中一个词,使用control+command+d,可以启用词典 option+command+d,隐藏/显示 doc command + k terminal 清除历史记录 control + up ...

  5. 在Web API中使用Swagger-UI开源组件（一个深坑的解决）

    介绍: Swagger-Ui是一个非常棒的Web API说明帮助页,具体详情可自行Google和百度. 官网:http://swagger.io/    GitHub地址:https://github ...

  6. android studio 完整安装教程，已完全实践过

    直接去官方下载包含android sdk的安装包(约813M),之前就是没有包含android sdk (约214M)所以需要另外从dl-google下载android sdk,太麻烦了.下面就一步步 ...

  7. Openmeeting 网页打开缓慢，视频卡的一个解决方法

    在初次安装完openmeeting以后,从浏览器打开后发现网页缓慢,视频有卡顿的现象. 原因:为openmeeting分配的内存太小. 解决方法: 找到根目录的red5.bat,打开后查找“set J ...

  8. win8安装新字体

    http://jingyan.baidu.com/article/e3c78d640a7ab33c4c85f52d.html

  9. centos 7 有点意思

    Centos 7 防火墙 Centos尼马换了防火墙,名叫firewalld,还有iptables命令,这就叫坑爹.整了半个世纪才知道,他换了防火墙.添加滤镜,停止iptables都打不开80端口,简 ...

  10. c++ 如何实现，readonly

    需求: 我要实现一个常量字段,只能赋值一次,赋值后不容许更改. 类似于c#的readonly或者java final #include <iostream> class  A{public ...