bootstrap简介及使用前的准备工作

最新推荐文章于 2023-07-15 16:40:44 发布

My_____Dream

最新推荐文章于 2023-07-15 16:40:44 发布

阅读量694

点赞数

分类专栏： bootstrap

本文链接：https://blog.csdn.net/My_____Dream/article/details/79252010

版权

bootstrap 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

bootstrap简介及使用前的准备工作

一、bootstrap简介

bootstrap是webcss框架,集合了html/css/jquery为一家创建响应式的页面。常用来做响应式页面。响应式:适配不同的上网设备。

二、使用步骤

1、下载bootstrap

网站:http://www.bootcss.com/ 。下载:用于生产环境(上线)的 Bootstrap

2、导入bootstrap.css

3、导入jquery.css

4、导入bootstrap.js

5、增加一个meta标签，支持移动设备优先

6、将所有的内容放入带布局容器中

Bootstrap 需要为页面内容和栅格系统包裹一个 .container 容器。我们提供了两个作此用处的类
方式1:
<div class="container"></div>
方式2:
<div class="container-fluid"></div>

三、代码演示

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">

<meta name="viewport" content="width=device-width,initial-scale=1" />
<title>入门</title>

<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css" />

<script type="text/javascript" src="bootstrap-3.3.5-dist/js/jquery-1.11.0.min.js"></script>

<script type="text/javascript" src="bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</head>
<body>

<div style="border:solid red 1px">
我是一般的默认方式
</div>
</body>
</html>

四、效果展示

备注：由于个人原因，本博客暂停更新。如有问题可联系本人，本人提供技术指导、学习方向、学习路线。本人微信wlp1156107728(添加注明来意) QQ1156107728(添加注明来意)

My_____Dream

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
bootstrap简介及使用前的准备工作

bootstrap简介及使用前的准备工作一、bootstrap简介 bootstrap是webcss框架,集合了html/css/jquery为一家创建响应式的页面。常用来做响应式页面。响应式:适配不同的上网设备。二、使用步骤1、下载bootstrap 网站:http://www.bootcss.com/ 。下载...
复制链接

扫一扫