争怎路由网:是一个主要分享无线路由器安装设置经验的网站,汇总WiFi常见问题的解决方法。

Bootstrap是什么?Bootstrap的容易介绍

时间:2024/6/1作者:未知来源:争怎路由网人气:

网页的本质就是超级文本标记语言,通过结合使用其他的Web技术(如:脚本语言、公共网关接口、组件等),可以创造出功能强大的网页。因而,超级文本标记语言是万维网(Web)编程的基础,也就是说万维网是建立在超文本基础之上的。超级文本标记语言之所以称为超文本标记语言,是因为文本中包含了所谓“超级链接”点。
本篇文章给大家带来的内容是关于Bootstrap是什么?Bootstrap的简单介绍,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。

【相关视频推荐:Bootstrap教程

一.Bootstrap 概述
Bootstrap 是由 Twitter 公司(全球最大的微博)的两名技术工程师研发的一个基于
HTML、CSS、JavaScript 的开源框架。该框架代码简洁、视觉优美,可用于快速、简单地
构建基于 PC 及移动端设备的 Web 页面需求。
2010 年 6 月,Twitter 内部的工程师为了解决前端开发任务中的协作统一问题。经历
各种方案后,Bootstrap 最终被确定下来,并于 2011 年 8 月发布。经过很长时间的迭代升
级,由最初的 CSS 驱动项目发展成为内置很多 JavaScript 插件和图标的多功能 Web 前端
的开源框架。
Bootstrap 最为重要的部分就是它的响应式布局,通过这种布局可以兼容 PC 端、PAD
以及手机移动端的页面访问。
Bootstrap 下载及演示:
国内文档翻译官网:http://www.bootcss.com

二.Bootstrap 特点
Bootstrap 非常流行,得益于它非常实用的功能和特点。主要核心功能特点如下:
(1).跨设备、跨浏览器
可以兼容所有现代浏览器,包括比较诟病的 IE7、8。当然,本课程不再考虑 IE9 以下
浏览器。
(2).响应式布局
不但可以支持 PC 端的各种分辨率的显示,还支持移动端 PAD、手机等屏幕的响应式切
换显示。
(3).提供的全面的组件
Bootstrap 提供了实用性很强的组件,包括:导航、标签、工具条、按钮等一系列组
件,方便开发者调用。
(4).内置 jQuery 插件
Bootstrap 提供了很多实用性的 jquery 插件,这些插件方便开发者实现 Web 中各种
常规特效。
(5).支持 HTML5、CSS3
HTML5 语义化标签和 CSS3 属性,都得到很好的支持。
(6).支持 LESS 动态样式
LESS 使用变量、嵌套、操作混合编码,编写更快、更灵活的 CSS。它和 Bootstrap 能
很好的配合开发。

三.Bootstrap 结构

首先,想要了解 Boostrap 的文档结构,需要在官网先把它下载到本地。Bootstrap
下载地址如下:
Bootstrap 下载地址:http://v3.bootcss.com/ (选择生产环境即可,v3.3.4)
解压后,目录呈现这样的结构:
bootstrap/
├── css/
│ ├── bootstrap.css
│ ├── bootstrap.css.map
│ ├── bootstrap.min.css
│ ├── bootstrap-theme.css
│ ├── bootstrap-theme.css.map
│ └── bootstrap-theme.min.css
├── js/
│ ├── bootstrap.js
│ └── bootstrap.min.js
└── fonts/
├── glyphicons-halflings-regular.eot
├── glyphicons-halflings-regular.svg
├── glyphicons-halflings-regular.ttf
├── glyphicons-halflings-regular.woff
└── glyphicons-halflings-regular.woff2
主要分为三大核心目录:css(样式)、js(脚本)、fonts(字体)。
1.css 目录中有四个 css 后缀的文件,其中包含 min 字样的,是压缩版本,一般使用
这个;不包含的属于没有压缩的,可以学习了解 css 代码的文件;而 map 后缀的文件则是
css 源码映射表,在一些特定的浏览器工具中使用。
2.js 目录包含两个文件,是未压缩和压缩的 js 文件。
3.fonts 目录包含了不同后缀的字体文件。

创建第一个bootstrap页面

<!--描述:Bootstrap之初体验-->
<!DOCTYPE html><html>
    <head>
        <meta charset="utf-8" />
        <title>bootstrap初体验</title>
    <link rel="stylesheet" href="css/bootstrap.css" />
    </head>
    <body>
        <button class="btn btn-default">bootstrap初体验之按钮</button>
    </body></html>

Bootstrap 将全局 font-size 设置为 14px,line-height 行高设置为 1.428(即20px);<p>段落元素被设置等于 1/2 行高(即 10px);颜色被设置为#333。

以上就是Bootstrap是什么?Bootstrap的简单介绍的详细内容,更多请关注php中文网其它相关文章!


网站建设是一个广义的术语,涵盖了许多不同的技能和学科中所使用的生产和维护的网站。



关键词:Bootstrap是啥?Bootstrap的容易介绍




Copyright © 2012-2018 争怎路由网(http://www.zhengzen.com) .All Rights Reserved 网站地图 友情链接

免责声明:本站资源均来自互联网收集 如有侵犯到您利益的地方请及时联系管理删除,敬请见谅!

QQ:1006262270   邮箱:kfyvi376850063@126.com   手机版