您的位置：首页 > Web前端 > BootStrap

bootstrap的概述、特点、结构和引用（使用安装）方法

2017-07-18 13:57 399 查看

一、Bootstrap 概述
一个基于HTML、CSS、JavaScript 的开源框架。该框架代码简洁、视觉优美，可用于快速、简单地构建基于PC 及移动端设备的Web 页面需求。Bootstrap 最为重要的部分就是它的响应式布局，通过这种布局可以兼容PC 端、PAD以及手机移动端的页面访问
下载网址http://getbootstrap.com/

二、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 结构

主要分为三大核心目录：css(样式)、js(脚本)、fonts(字体)。
1.css 目录中有四个css 后缀的文件，其中包含min 字样的，是压缩版本，一般使用
这个；不包含的属于没有压缩的，可以学习了解css 代码的文件；而map 后缀的文件则是
css 源码映射表，在一些特定的浏览器工具中使用。
2.js 目录包含两个文件，是未压缩和压缩的js 文件。
3.fonts 目录包含了不同后缀的字体文件。

四、安装使用
<!DOCTYPEhtml>
<html>

<head>

<title>Bootstrap
模板</title>

<metaname="viewport"content="width=device-width,
initial-scale=1.0">



<linkhref="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"rel="stylesheet">







</head>

<body>

<h1>Hello,
world!</h1>



<scriptsrc="https://code.jquery.com/jquery.js"><
c2f0
/span></script>



<scriptsrc="js/bootstrap.min.js"></script>

</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航