星空网 > 软件开发 > Java

【BootStrap】初步教程

[html] view plaincopy 


  1. <span style="font-family: Arial, Helvetica, sans-serif;">最近刚刚接触到BootStrap,在这里总结一下BootStrap的使用方法。</span>  

 

1、BootStrap的下载

      Bootstrap 中文网 为 Bootstrap 专门构建了自己的免费 CDN 加速服务。基于国内云厂商的 CDN 服务,访问速度更快、加速效果更明显、没有速度和带宽限制、永久免费。即可以在不下载BootStrap的情况下使用BootStrap。

  BootStrap中文网网址:http://www.bootcss.com/

 

2、在页面中引用BootStrap

 

[html] view plaincopy 


  1. <meta charset="utf-8">  
  2. <meta http-equiv="X-UA-Compatible" content="IE=edge">  
  3. <meta name="viewport" content="width=device-width, initial-scale=1">  
  4. <!-- 上述3个meta标签*必须*放在最前面,任何其他内容都*必须*跟随其后! -->  

[html] view plaincopy 


  1. <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css">  

[html] view plaincopy 


  1. <!--<script src='/images/loading.gif' data-original="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script>-->  
  2. <!-- Include all compiled plugins (below), or include individual files as needed -->  
  3. <!--<script src='/images/loading.gif' data-original="http://cdn.bootcss.com/bootstrap/3.3.4/js/bootstrap.min.js">-->  

在没有下载BootStrap的时候,引用BootStrap中文网为我们提供的css库和js库。当我们下载BootStrap的时候,则引用本地的库文件:

 

[html] view plaincopy 


  1. <link rel="stylesheet" href="css/bootstrap.min.css">  

 

 

[html] view plaincopy 


  1. <script src='/images/loading.gif' data-original="js/bootstrap.min.js"></script> <!-- 解压后的本地文件 -->  
  2. <!-- Include all compiled plugins (below), or include individual files as needed -->  
  3. <script src='/images/loading.gif' data-original="js/jquery-2.1.4.min.js">  

 

 

3、使用BootStrap为我们提供的样式和效果

在页面中我们只需要引用BootStrap为我们写好的类选择器即可获得BootStrap的各种效果。比如:

(1)按钮样式:

 

*按钮的大小采用.btn-large.btn-small, 或 .btn-mini

通过添加.btn-block 创建块级按钮, 同时会填充整个父级的宽度


*按钮的可用与否采用.disabled

 

 

其他的就不多说了,以上示例来自BootStrap官网。

 

说明:以上示例来自http://bootstrap.kinghack.com/base-css.html,大家也可以通过这个网站来学习BootStrap的使用。

 




原标题:【BootStrap】初步教程

关键词:

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

外资企业如何管理vat税务责任?:https://www.kjdsnews.com/a/1311836.html
墨西哥的vat税务:哪些卖家需要注册增值税税号?:https://www.kjdsnews.com/a/1311837.html
墨西哥vat违规缴税会面临多大的处罚?:https://www.kjdsnews.com/a/1311838.html
墨西哥vat税号自申请的要求及条件:https://www.kjdsnews.com/a/1311839.html
海外众筹成功后Kickstarter履行:它是什么,你需要知道什么:https://www.kjdsnews.com/a/1311840.html
砍掉中间商,国际电商平台巨头有大动作:https://www.kjdsnews.com/a/1311841.html
独家丨B站广告位可跳转美团APP B站为电商平台引流再升级 :https://www.kjdsnews.com/a/1836410.html
百崖大峡谷生态旅游景区(探秘中国西南自然风光):https://www.vstour.cn/a/363176.html
相关文章
我的浏览记录
最新相关资讯
海外公司注册 | 跨境电商服务平台 | 深圳旅行社 | 东南亚物流