zoukankan
html css js c++ java
初入前端框架bootstrap--Web前端
Bootstraps是一种简洁、直观、强悍的前端开发框架,它让web开发更迅速、简单。对于初入Bootstrap的小白,高效进入主题很重要,能为我们节省很多时间,下面我将对使用Bootstrap开发前应该做什么做出详细指引,初学者可以围观一下,大神可以忽略哦!
1、下载Bootstrap框架
Bootrap:http://getbootstrap.com/2.3.2/getting-started.html
Bootrap中文网:http://v3.bootcss.com/getting-started/#download
解压后的Bootstrap文件夹:
2、下载j
query.js
jQuery官网:https://jquery.com/download/
笔者对Bootstrap框架以及jquery进行了收集,你可直接下载
bootstrap-3.3.7-dist.zip
,
jQuery.zip
(当前时间最新版)
3、
你需要把jQuery.js放入js文件夹中
4、在html中引入框架文件(以下两种方式可以按需选择)
1)引入本地文件
bootstrap.min.css:
<link href="css/bootstrap.min.css" rel="stylesheet">
bootstrap.min.js:
<script src="js/bootstrap.min.js"></script>
jquery-3.2.1.min.js:
<script src="js/jquery-3.2.1.min.js"></script>
2)引入网络上文件
使用 BootCDN 提供的免费 CDN 加速服务(同时支持 http 和 https 协议),即引入网络上的文件,需要电脑联网。
bootstrap.min.css:
<link rel="stylesheet"href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
bootstrap.min.js:
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
jQuery.js:
https://code.jquery.com/jquery-3.2.1.min.js
5、引入meta,实现屏幕适配
<meta name="viewport" content="width=device-width, initial-scale=1">
6、最终的html文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>bootstrap</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link
href="css/bootstrap
.min.css"
rel="stylesheet">
</head>
<body>
</body>
<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</html>
图示:
查看全文
相关阅读:
【NOIP2015四校联训Day7】 题 题解(Tarjan缩点+DFS)
【NOIP2013】火柴排队 题解(贪心+归并排序)
【AHOI2009】中国象棋 题解(线性DP+数学)
【HDU5869】 Different GCD Subarray Query 题解 (线段树维护区间GCD)
【FZYZOJ】愚人节礼物 题解(状压DP)
JavaSE 基础 第12节 基本算术运算符与模运算符
JavaSE 基础 第11节 深入理解字符串
JavaSE 基础 第09节 赋值与初始化
JavaSE 基础 第08节 数据类型转换
JavaSE 基础 第07节 变量和常量
原文地址:https://www.cnblogs.com/qikeyishu/p/7534885.html
最新文章
Tufurama CodeForces
K-th Number POJ
【Linux学习】源码安装
【Linux学习】jq:一款json格式化神器
【Git学习】The requested URL returned error: 403
【Git学习】git 特殊命令
【Mysql学习】mysql查询结果竖向显示
【Mysql学习】Mysql常用函数
【Mysql学习】MySQL 常见错误
【Mysql学习】Mysql 用户权限管理
热门文章
【Mysql学习】mysql如何修改root用户的密码
【Docker总结】Docker格式化输出命令:"--format" 学习笔记
[XJOI]最大K段和 题解
[XJOI]二进制中连续k个1 题解
[算法]网络最大流Dinic
【BZOJ3307】雨天的尾巴 题解(树链剖分+树上差分)
树链剖分 学习笔记
【PA2014】Bohater 题解(贪心)
【SDOI2012】Longge 的问题 题解(欧拉函数)
【FZYZOJ】珂神不等式&平角咖啡厅 题解(二分答案)
Copyright © 2011-2022 走看看