Bootstrap新手入门

bootstrap中文官网:http://www.bootcss.com/

一、首先要把bootstrap的css样式和jquery引入进来

引用bootstrap有两种方法:

1.   下载源码把源码放入项目中本地引用

2.   直接引用官网的现有文件   注:(bootstrap.min.css和bootstrap.css)区别不大,一个是压缩过的,一个是格式化过的(就是写的简洁一点,方便看的懂,后面加上min的大多只有一行,密密麻麻的,中间没有空格,所以是压缩过的。):

<!-- 最新版本的 Bootstrap 核心 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 主题文件(一般不用引入) -->
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

二、进入官网进行对官网的代码进行调试

选择顶部的起步进入页面其中有安装下载具体方法。

接下来我们进入组件页面往下滑动可以看到这样的界面

点击右上角的copy复制代码把代码粘贴到自己代码的body内在浏览器中运行查看效果,还有更多图标 只需吧span的class值改为想要使用的图标名称即可调用。

 

在以后实际项目中可以到https://v3.bootcss.com/components/这个页面查找图标然后调用

剩下的其他css以及jquery插件都可以通过类似方法进行调试熟悉 ,入门教程就到这里接下来的探索学习就交给大家了!

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值