BootStrap笔记-BootStrap的安装与使用

下载BootStrap，如4.4.1

如下代码；

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>CN_TEST1</title><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"><!--    bootstrap css核心文件--><link rel="stylesheet" href="bootstrap-4.4.1-dist/css/bootstrap.min.css">
<!--    bootstrap使用到了jquery，需要提前引用--><script src="js/jquery-3.5.1.min.js"></script>
<!--    弹窗、提示、下拉菜单--><script src="bootstrap-4.4.1-dist/js/bootstrap.bundle.js"></script>
<!--    bootstrap核心文件--><script src="bootstrap-4.4.1-dist/js/bootstrap.min.js"></script></head>
<body>
<!--    <div class="container" style="background: orangered">-->
<!--        <h1>class = container</h1>-->
<!--        <p>中文，，，English</p>-->
<!--    </div>--><div class="container-fluid" style="background: orangered"><h1>class = container</h1><p>中文，，，English</p></div>
</body>
</html>

其中：

    <div class="container-fluid" style="background: orangered"><h1>class = container</h1><p>中文，，，English</p></div>

对应的效果：

其中

    <div class="container" style="background: orangered"><h1>class = container</h1><p>中文，，，English</p></div>

对应的效果：

解释下：

①meta中的width=device-width代表宽度是设备的宽度也就是视口=布局=理想视口；

②initial-scale=1代表初始的放缩比例为1；

③shrink-to-file=no是在IOS9中上面2条才能起作用，其他的设备可以忽略。

BootStrap笔记-BootStrap的安装与使用相关推荐

BootStrap笔记参考（全）-优极限
目录 BootStrap 1.主要内容 2.BootStrap的安装和使用 2.1BootStrap介绍 2.2BootStrap特点 2.3下载与使用 3.布局容器和栅格网格系统 3.1布局容器 3 ...
学习总结5 - bootstrap学习记录1__安装
1.bootstrap是什么? 简洁.直观.强悍的前端开发框架,说白了就是给后端二把刀开发网页用的,让web开发更迅速.简单. 复制代码 2.如何使用? 如图所示到bootstrap中文网进行下载复 ...
windows pxe 安装linux,菜鸟学Linux 第103篇笔记 pxe自动化安装linux
菜鸟学Linux 第103篇笔记 pxe自动化安装linux 内容总览 linux的系统安装 kickstart文件的组成部分 DHCP (Dynamic Host Configuration Pro ...
STM32F103CUBE学习笔记一环境安装
STM32F103CUBE学习笔记一 stm32cubemx安装 jre安装 stm32cubemx安装 stm32cubemx创建工程准备工作配置时钟 KEIL PACK安装 keil安装 st ...
Bootstrap -- 初见 Bootstrap
Bootstrap -- 初见 Bootstrap Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的. ...
tensorflow学习笔记一：安装调试
denny的学习专栏徐其华博客园首页新随笔联系管理订阅随笔- 129 文章- 0 评论- 791 tensorflow学习笔记一:安装调试用过一段时间的caffe后,对caff ...
PHP学习笔记01：安装PHP开发套件xampp
PHP学习笔记01: 安装PHP开发套件xampp 1.从网上下载xampp7.3.7 2.安装xampp
APPCAN学习笔记005---AppCan IDE安装下载,AppCan IDE启动
APPCAN学习笔记005---AppCan IDE安装下载,AppCan IDE启动创梦技术交流平台:资源下载,技术交流,网络赚钱: 交流qq群:1群:248318056 2群:251572072 ...
ROS学习笔记一：安装配置ROS环境
ROS学习笔记一:安装配置ROS环境在安装完成ROS indigo之后,需要查看环境变量是否设置正确,并通过创建一个简单的实例来验证ROS能否正常运行. 1 查看环境变量在ROS的安装过程中,我们 ...

BootStrap笔记-BootStrap的安装与使用

BootStrap笔记-BootStrap的安装与使用相关推荐

最新文章

热门文章