第一章Bootstrap简介
-
一、Bootstrap简介
Bootstrap是基于 HTML、CSS、JAVASCRIPT 的前端框架,它简洁灵活,使得 Web 开发更加快捷。它由Twitter的设计师Mark Otto和Jacob Thornton合作开发,是一个CSS/HTML框架。Bootstrap提供了优雅的HTML和CSS规范,它即是由动态CSS语言Less写成。
版本
目前使用较广的是版本2和3,其中2的最新版本的是2.3.2,3的最新版本是3.3.7。在2015年8月下旬,Bootstrap四周岁之际,Bootstrap团队发布了Bootstrap 4 alpha版,4的最主要变化包括以下方面:- 从 Less 迁移到 Sass
- 改进网格系统
- 缺省弹性框支持
- Dropped wells, thumbnails, and panels for cards
- 合并所有 HTML resets 到一个新的模块中:Reboot
- 全新自定义选项
- 不再支持 IE8
- 重写所有的 JavaScript 插件
- 改进工具提示和 popovers 的自动定位
- 改进文档
- 其他大量改进
二、使用配置
中文官网:www.bootcss.com ,该网站包含Bootstrap的各个版本的在线文档、以及各种相关的插件
英文官网:https://getbootstrap.com/
在http://v3.bootcss.com/getting-started/中,可以下载Bootstrap,
下载压缩包之后,将其解压缩到任意目录即可看到以下目录结构:
bootstrap/
├── css/
│ ├── bootstrap.css
│ ├── bootstrap.min.css
│ ├── bootstrap-theme.css
│ └── 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这是最基本的Bootstrap组织形式:未压缩版的文件可以在任意web项目中直接使用。我们提供了压缩(
bootstrap.min.*
)与未压缩 (bootstrap.*
)的CSS和JS文件。字体图标文件来自于Glyphicons。包内容
- 基本结构:Bootstrap 提供了一个带有网格系统、链接样式、背景的基本结构。
- CSS:Bootstrap 自带以下特性:全局的 CSS设置、定义基本的 HTML 元素样式、可扩展的 class,以及一个先进的网格系统。
- 组件:Bootstrap 包含了十几个可重用的组件,其中包括以下组件:下拉菜单、按钮组、按钮下拉菜单、导航、导航条、路径导航、分页、排版、缩略图、警告对话框、进度条、媒体对象等。
- JavaScript 插件:Bootstrap包含了十几个自定义的jQuery 插件。其中包括:模式对话框、标签页、滚动条、弹出框等。
- 定制:您可以定制Bootstrap的组件、LESS 变量和jQuery 插件来得到您自己的版本。
使用要点
1.项目中配置bootstrap
引用jquery-1.9.1.js,bootstrap.min.js,bootstrap.css
2.IIS 添加mime类型 .woff
application/x-font-woff注意:VS发布后确保bootstrap下的文件都有拷贝过去,如果没有,请手动拷贝,否则出现图标不显示等问题代替方案:使用web.config配置<system.webServer>
<staticContent>
<remove fileExtension=".woff" />
<remove fileExtension=".woff2" />
<mimeMap fileExtension=".woff" mimeType="application/font-woff" />
<mimeMap fileExtension=".woff2" mimeType="application/font-woff" />
</staticContent>
</system.webServer>3.插件推荐树形插件:https://gist.github.com/clayzermk1/3317341#file-bootstrap-listtree-css4.图标 Font Awesome
http://www.bootcss.com/p/font-awesome/
5. Visual Studio 和 bootstrap
在vs2013发布之后,创建mvc的项目自带了bootstrap库,然而版本库是.net Framework4.5以上,如果使用.NET 4.0 是不包含bootstrap的
参考文章:
https://baike.baidu.com/item/Bootstrap/8301528?fr=aladdin
第一章Bootstrap简介的更多相关文章
- 第一章 Bootstrap简介
一.Bootstrap简介 Bootstrap是基于 HTML.CSS.JAVASCRIPT 的前端框架,它简洁灵活,使得 Web 开发更加快捷.它由Twitter的设计师Mark Otto和Jaco ...
- 第一章 C++简介
第一章 C++简介 1.1 C++特点 C++融合了3种不同的编程方式:C语言代表的过程性语言,C++在C语言基础上添加的类代表的面向对象语言,C++模板支持的泛型编程. 1.2 C语言及其编程 ...
- python 教程 第一章、 简介
第一章. 简介 官方介绍: Python是一种简单易学,功能强大的编程语言,它有高效率的高层数据结构,简单而有效地实现面向对象编程.Python简洁的语法和对动态输入的支持,再加上解释性语言的本质,使 ...
- 学习笔记-[Maven实战]-第一章:Maven简介
Maven简介: Maven 可翻译为:知识的积累,也可以翻译为"专家"或"内行". Maven 是一个跨平台的项目管理工具,是Apache组织中一个很成功的开 ...
- 《跟我学Shiro》学习笔记 第一章:Shiro简介
前言 现在在学习Shiro,参照着张开涛老师的博客进行学习,然后自己写博客记录一下学习中的知识点,一来可以加深理解,二来以后遗忘了可以查阅.没有学习过Shiro的小伙伴,也可以和我一起学习,大家共同进 ...
- 《JavaScript高级程序设计》——第一章JavaScript简介
第一章主要讲了JavaScript的诞生和发展.刚刚接触JavaScript的我,似乎对这些内容并不感兴趣,快速看了一遍就开始去看第二章了. 看完第一章,收获也就是了解到JavaScript由ECMA ...
- 第一章 Shiro简介——《跟我学Shiro》(转)
目录贴:跟我学Shiro目录贴 1.1 简介 Apache Shiro是Java的一个安全框架.目前,使用Apache Shiro的人越来越多,因为它相当简单,对比Spring Security,可 ...
- 第一章 Mysql 简介及安装和配置
Mysql是最流行的关系型数据库管理系统,在WEB应用方面MySQL是最好的RDBMS(Relational Database Management System:关系数据库管理系统)应用软件之一. ...
- python第一章:简介与安装--小白博客
Python简介 Python是一种计算机程序设计语言.是一种动态的.面向对象的脚本语言,最初被设计用于编写自动化脚本(shell),随着版本的不断更新和语言新功能的添加,越来越多被用于独立的.大型项 ...
随机推荐
- Make ISO安装ArchLinux加Cinnamon
Arch安装一直对大家对普通用户来說一直很难.国外大神为Arch安装进行了优化提供了更方便的安装方式 官网:http://www.evolutionlinux.com/ 以下爲个人理解,供大家参考. ...
- PHP错误——Allowed memory size of 134217728 bytes exhausted (tried to allocate 32 bytes)
解释是可用内存已耗尽,这关系到PHP的memory_limit的设置问题. 这里有两种方法解决 1.修改php.ini memory_limit = 128 打开终端输入下列bash命令 cd /pr ...
- springmvc常遇到的错误
错误1: HTTP Status 500 - Handler processing failed; nested exception is java.lang.NoClassDefFoundError ...
- Markdown基本语法总结
一.标题 在想要设置为标题的文字前面加#来表示 一个#是一级标题,二个#是二级标题,以此类推.支持六级标题. 注:标准语法一般在#后跟个空格再写文字. 示例: # 这是一级标题 ## 这是二级标题 # ...
- ArcGis10.2破解教程
ArcGis10.2下载地址: https://pan.baidu.com/s/15s5ki_8gf0_732br6h43Hw 破解步骤: 1.完成License Manager的安装. 2.将破解文 ...
- secureCRT scripts as vbs
gdb multithread debug. lsusb.py # $language = "VBScript" # $interface = "1.0" Su ...
- Ngin 简单配置文件
#user nobody; worker_processes ; #error_log logs/error.log; #error_log logs/error.log notice; #error ...
- 【html5】cookie、sessionStorage、localStorage
第四条补充: cookie中包含domain和path,所有向该域下该路径发送的请求头部都会包含这个cookie: session浏览器关闭后消失,只能由最初给对象存储数据的页面访 ...
- java7之Special Methods
1.关于<init>与<clinit> At the level of the Java Virtual Machine, every constructor written ...
- Capture Conversion解读
Let G name a generic type declaration with n type parameters A1,...,An with corresponding bounds U1, ...