脚本之家 服务器常用软件
快捷导航
您的位置：首页 → 网络编程 → JavaScript → javascript技巧 → BootStrap前端框架

BootStrap前端框架使用方法详解

 更新时间：2020年02月26日 12:06:49   作者：遍唱阳春  
这篇文章主要介绍了BootStrap前端框架使用方法详解,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

1.概念：

Bootstrap，是目前很受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JavaScript 的，它简洁灵活，使得 Web 开发更加快捷。

好处：

  • 1.定义了很多的css样式和js插件。我们开发人员直接可以使用这些样式和插件得到丰富的页面效果。
  • 2.响应式布局。

同一套页面可以兼容不同分辨率的设备。

2.使用步骤：

1.下载Bootstrap,官网地址：https://v3.bootcss.com

2.在项目中将这三个文件夹复制

3.创建html页面，引入必要的资源文件 

<!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">
      <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
      <title>Bootstrap HelloWorld</title>
    
      <!-- Bootstrap -->
      <link href="css/bootstrap.min.css" rel="external nofollow" rel="stylesheet">
    
    
      <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
      <script src="js/jquery-3.2.1.min.js"></script>
      <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
      <script src="js/bootstrap.min.js"></script>
    </head>
    <body>
    <h1>你好，世界！</h1>
    
    </body>
    </html>

4.然后就可以去官网上copy你想要的组件啦！

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

相关文章

  • 详解element-ui 表单校验 Rules 配置 常用黑科技

    详解element-ui 表单校验 Rules 配置 常用黑科技

    这篇文章主要介绍了element-ui 表单校验 Rules 配置 常用黑科技，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
    2020-07-07
  • js防止表单重复提交的两种方法

    js防止表单重复提交的两种方法

    第一种：用flag标识，下面的代码设置checkSubmitFlg标志；第二种：在onsubmit事件中设置，在第一次提交后使提交按钮失效，感兴趣的朋友可以了解下
    2013-09-09
  • js中符号转意问题示例探讨

    js中符号转意问题示例探讨

    符号转意，大家或许有所了解，知识在使用中或许不是那么的在意，其实这个问题很重要，下面为大家讲解下js符号转意问题相关知识，感兴趣的朋友可以参考下
    2013-08-08
  • js扁平数组和树结构相互转换处理方法

    js扁平数组和树结构相互转换处理方法

    这篇文章主要给大家介绍了关于js扁平数组和树结构相互转换处理方法的相关资料,之前面试有遇到过这个问题,面试官问如何把一个数组数据扁平,然后转化为Tree结构数据,工作中刚好也用到了,所以总结下,需要的朋友可以参考下
    2023-07-07
  • JavaScript中关于for循环删除数组元素内容时出现的问题

    JavaScript中关于for循环删除数组元素内容时出现的问题

    昨天在用for循环进行数组去重的时候出现的问题小结，怎么解决这个问题呢，今天小编通过本文给大家讲解下js循环删除数组元素的方法，一起看看吧
    2016-11-11
  • Javascript获取某个月的天数

    Javascript获取某个月的天数

    本文给大家分享使用getDaysInOneMonth(year, month)方法获取某个月的天数，方法超简单，感兴趣的朋友一起看看吧
    2018-05-05
  • 谈谈JavaScript中的函数

    谈谈JavaScript中的函数

    这篇文章主要介绍了JavaScript中的函数的相关资料，帮助大家更好的理解和学习JavaScript，感兴趣的朋友可以了解下
    2020-09-09
  • javascript实现验证身份证号的有效性并提示

    javascript实现验证身份证号的有效性并提示

    下面分享的JS脚本是我用过的最完善的身份证号的验证程序了，因为只有真正的身份证号才能被通过，小伙伴们可以试试。直接复制运行。
    2015-04-04
  • JavaScript的new date等日期函数在safari中遇到的坑

    JavaScript的new date等日期函数在safari中遇到的坑

    safari中对于JavaScript的new Date函数的支持有一个比较奇怪的问题，带着这个奇怪的问题我们通过本文一起学习吧
    2016-10-10
  • js控制网页前进和后退的方法

    js控制网页前进和后退的方法

    这篇文章主要介绍了js控制网页前进和后退的方法,涉及javascript中history.go方法的相关使用技巧,非常简单实用,需要的朋友可以参考下
    2015-06-06

最新评论