ITPub博客

首页 > IT职业 > IT生活 > Web前端开发之BootStrap学习一

Web前端开发之BootStrap学习一

IT生活 作者:hoonty 时间:2021-09-09 10:29:35 0 删除 编辑

一、什么是BootStrap?

BootStrap是基于html、css、js的前端框架,便于web开发人员快速开发系统页面。

二、BootStrap环境如何搭建?

1、下载JetBrains WebStorm开发工具(基于BootStrap)

2、创建基于Bootstrap框架的项目。

图片描述

图片描述

3、由于Bootstrap中js文件的执行需要使用jquery文件,所以需要下载jquery文件置于Bootstrap的js文件夹中。

图片描述

至此Bootstrap开发环境搭建完毕!

三、Bootstrap第一个入门demo

1、新建html页面

2、页面中引入css文件夹中的bootstrap.css文件

3、页面中引入js文件夹中的jquery-3.1.1.min.js、bootstrap.js文件

图片描述

页面中加入以下内容:

<link rel="stylesheet" href="../css/bootstrap.css">
<script type="text/javascript" href="../js/jquery-3.1.1.min.js"></script>
<script type="text/javascript" href="../js/bootstrap.js"></script>
<button class="btn btn-info">Hello World</button>

浏览器中的效果:

图片描述

欢迎交流!


来自 “ ITPUB博客 ” ,链接:https://blog.itpub.net/4222/viewspace-2822701/ ,如需转载,请注明出处,否则将追究法律责任。

上一篇: 手风琴效果
请登录后发表评论 登录
全部评论

注册时间:2019-08-12

  • 博文量
    94
  • 访问量
    1271