bootstrap遮罩层（bootstrap底部导航栏）
-
-
类目：知识大全
-
联系人：
-
微信号：
-
Q Q 号：
-
手机号：
-
浏览量：
338
【商户信息】
【货源详情】
随着互联网时代的到来，网络接口不断优化，不断追求美感。 包括幽灵按钮、字体增强、视频背景、卡片设计、平面化、响应性设计等多种网页设计方法，为了方便前端页面的开发，前端框架应运而生其中Bootstrap是最有名的东西之一。
一开始学习这个框架的时候，说实话(谁还不是菜鸟)。 当我开始接触这个布局框架时，我感到无助。 学框架的人说很简单，我想一定是骗人的。 首先使用这个框架必须构筑环境，所以很难打倒很多人。 例如为HTML构建环境吗？ 很明显，没有必要和环境结合。 当我们知道真相时，我们的悲伤一定小于喜悦。 那是因为有环境的组合方式。 只是，比HTML有点麻烦。 要掌握框架就必须理解其结构。 虽说这个框架和以前提到的HTML、CSS不同，但原理也是一样的。 要理解这个框架，可以从多个角度来理解。 例如，如果是容器，可以理解为房子、大楼、空间等。 例如，网格可以理解为一个组成部分。 其实不管我们用什么方法理解，都必须选择适合自己记忆的理解方法。 不知道大家在学习这个框架之前，有没有和我一样困惑？
首先是简洁、方便、兼容。 使用此框架，它涵盖了前端知识，如HTML、CSS和JavaScript，因此不需要学习其他前端知识。 曾经因为屏幕大小的问题需要多次更改网页的样式，但Bootstrap的出现让我不再担心这个问题。 理由是什么？ 响应框架适用于各种屏幕大小。 除了这些，我最欣赏的是那个网页布局。 它给人们带来了简单的美，更体现了让复杂的事物变得简单的道理。 无论是京东还是苏宁，进入网页后都不会感到视觉疲劳，物品都能清晰呈现。
接下来是个人对Bootstrap的理解。 请进行错误修正。 首先学习Bootstrap。 我们明确地在几个方面
什么是Bootstrap？
如何组合环境？
你是怎么做版面设计的？
那是为了什么？
其弊端在那里吗？
1. 什么是Bootstrap?
首先，让我们把概念推广一下：
Bootstrap是一种前端框架，是目前最流行、最受欢迎的web前端框架，由Twitter公司的Mark Otto和Jacob Thornton共同开发，Bootstrap 基于JavaScript开发，简洁、直观、功能强大的Bootstrap前端框架加快了Web开发，采用动态CSS语言Less编写的优雅HTML、CSS、JavaScript工作Bootstrap前端框架刚上市就很受欢迎，是GitHub上很受欢迎的开源项目，是前端开发人员非常熟悉的框架。
其实是HTML、CSS、JS的包！
只要我们掌握了HTML和CSS的基础知识，就可以一起学习Bootstrap。
2. 怎么搭配Bootstrap的环境呢？
首先，从站点下载Bootstrap压缩包，然后解压缩(可以是系统磁盘以外的磁盘)。
根据开发者的能力和使用场景，Bootstrap有以下三种不同的方法来帮助快速开发。
在用户生产环境中的Bootstrap :下载包是经过编译并压缩的CSS、JavaScript和字体文件，不包含任何文档或源文件。
Bootstrap源代码：包括Less、JavaScript和字体文件的源代码等。
Sass :这是Bootstrap从Less到Sass的源代码移植项目，用于快速部署到Rails、Compass或Sass专用项目。
参考位置如下。
Bootstrap官方网站： http://www.bootstrap.com/
Boostrap中文网： http://www.bootcss.com/
简单的模板
呃！ DOCTYPE html
html lang=”zh-CN "
头儿
meta charset=”utf-8/
meta http-equiv=" x-ua-compatible " content=" ie=edge " /
metaname=" viewport " content=" width=device-width，initial-scale=1/
titleBootstrap基本模板/title
link href=" ./bootstrap-3.3.4/CSS/bootstrap.min.CSS " rel=" style sheet " /
link href=" ./bootstrap-3.3.4/CSS/bootstrap-theme.min.CSS " rel=" style sheet " /
！ [ ifl tie9]
script src=" ./bootstrap-3.3.4/js/html 5s HIV.min.js "/script "
script src=" ./bootstrap-3.3.4/js/respond.min.js "/script "
！ [ endif ]
/head
身体
h1你好，Bootstrap现在开始/h1
script src=" ./bootstrap-3.3.4/js/jquery.min.js " type=" text/JavaScript "/script
script src=" ./bootstrap-3.3.4/js/bootstrap.min.js " type=" text/JavaScript "/script
/body
/html
3. 它是怎么组成一个布局？
首先，我们知道Bootstrap是一个响应布局框架，一个框架中一定会容纳其他内容。 这叫做集装箱。 Bootstrap使用的是容器类。 Bootstrap通常向名为class的类写入样式。 在这个集装箱里，有固定宽度。 但是，固定宽度不允许设置容器的宽度，在Bootstrap内部通过bootstrap.css根据屏幕宽度利用媒体查询，这是容器的使用图像。 让我们来看看。
完美的布局主要是有一个简单的容器，我知道如果我们这么想的话，就属于贬低它。 在这里必须举出名字。 网格系统也称为网格系统。 让我们看一下网格系统的整个布局图像。
根据该布局图像，这是container的内部布局，网格系统包含row (行)、column (列)列，在图像1中可以看到行和列。
首先，row行中有12列column列相当于12个网格，每个网格对应一列。 如图2所示，每个column列也有12个网格，每个网格中可以放置12个column列。 典型的网页布局是按2-8-2(column列)在网页上布局！ 我们也可以用不同的布局表达自己的逻辑！
下图显示了768像素到992像素之间的常见布局方法col-md-1。 这个(1)表示网格的相当多的列(column )。
以下是Bootstrap的几种不同的画面自适应响应式样式，请了解对今后的网页布局有帮助。
4. 它是用来干什么的？
随着各种计算机的出现，屏幕尺寸、web界面都不适合屏幕，这让前端工程师们头痛不已。
Bootstrap的出现解决了很多问题。 首先，我们的页面可以不交换。 它可以适用于各种屏幕的大小(我们不用担心在不同的屏幕上交换不同网页的问题) 通过框架布局，我们可以迅速制作出美丽、逻辑清晰的网页。 看看完整的Bootstrap页面吧！
下一页是正常大小。
下一页是屏幕缩小的大小
Bootstrap可以调用CSS、JavaScript，在没有图稿的网站装饰中充分表现出他们的美感和简约的动感。
Bootstrap大多用于建立不太复杂的门户网站，比如淘宝、京东、管理系统等页面在PC端和移动端根据屏幕大小，来自自适应的网页布局(一般来说，PPP 让网民对网站的印象更深，让网民一眼就能掌握网站，就能知道这个网站具体想表达什么内容。 这样的页面一般应用于简单的门户网站。
5. Bootstrap的局限性
总体来说，bootstrap那些页面布局复杂，内容很多，尤其不太适合很酷的网站。 因为bootstrap已经写了CSS的样式，所以我引用bootstrap来更改CSS的样式。 组件、插件太多，代码容易混乱，最好不要直接使用。 特别是对初学者的前端工程师来说，不推荐。 但是，它适用于企业内部的网站。 通常，这类网站对页面布局要求不高。 只要发挥主要功能即可，bootstrap完全符合这类网站的特性。
作者的礼物：
那些想要学习Bootstrap的灵鬼还在犹豫什么？ 这样实用简单的框架不受我们的欢迎吧？
如果有什么不对的地方，欢迎指出来。 毕竟，我很肤浅，欢迎指出问题所在，互相学习，获益。
世上没有什么难事，只怕有心人，世上不再有行人了，我期待着我们能更上一层楼。
