关于Bootstrap打包的文件分别代表什么意思,官网也没有给出一个明确的解释,在网上查了一些资料,总价归纳了如下:

bootstrap/    <!--主目录-->
├── css/ <!--CSS样式文件-->
│ ├── bootstrap.css <!--Bootstrap核心CSS文件-->
│ ├── bootstrap.css.map <!--source map文件-->
│ ├── bootstrap.min.css <!--Bootstrap核心CSS文件 压缩版-->
│ ├── bootstrap.min.css.map
│ ├── bootstrap-theme.css <!--可选的Bootstrap主题文件(一般不用引入)-->
│ ├── bootstrap-theme.css.map
│ ├── bootstrap-theme.min.css <!--可选的Bootstrap主题文件(一般不用引入) 压缩版-->
│ └── bootstrap-theme.min.css.map
├── js/ <!--JavaScript文件-->
│ ├── bootstrap.js <!--Bootstrap核心JavaScript文件-->
│ └── bootstrap.min.js <!--Bootstrap核心JavaScript文件 压缩版-->
└── fonts/ <!--字体图标-->
├── glyphicons-halflings-regular.eot
├── glyphicons-halflings-regular.svg
├── glyphicons-halflings-regular.ttf
├── glyphicons-halflings-regular.woff
└── glyphicons-halflings-regular.woff2

*bootstrap.css 是完整的bootstrap样式表,未经压缩过的,可供开发的时候进行调试用
*bootstrap.min.css 是经过压缩后的bootstrap样式表,内容和bootstrap.css完全一样,但是把中间不必要的空格之类的东西都删掉了,所以文件大小会比bootstrap.css小,可以在部署网站的时候引用,如果引用了这个文件,就没必要引用bootstrap.css了,下面的文件同样。

bootstrap的环境至少需要3个文件:bootstrap.min.css、jQuery.min.js、bootstrap.min.js,具体代码如下:

<!-- 新 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css"> <!-- 可选的Bootstrap主题文件(一般不用引入) -->
<link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap-theme.min.css"> <!-- jQuery文件,务必在bootstrap.min.js 之前引入 -->
<script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script> <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="//cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

需要注意的是:
bootstrap.min.css、jquery.min.js、bootstrap.min.js这三个文件的引入顺序一定不能错乱,一般把jquery.min.js、bootstrap.min.js这两个文件放入HTML网页的最底部,这么做是为了防止网页未加载完毕而这两个文件先加载可能产生的不必要的问题。

关于字体文件的解释:

而由于网页中使用的字体类型,也是各浏览器对字体类型有不同的支持规格。 字体格式类型主要有几个大分类:TrueType、Embedded Open Type 、OpenType、WOFF 、SVG。

TrueType

Windows和Mac系统最常用的字体格式,其最大的特点就是它是由一种数学模式来进行定义的基于轮廓技术的字体,这使得它们比基于矢量的字体更容易处理,保证了屏幕与打印输出的一致性。同时,这类字体和矢量字体一样可以随意缩放、旋转而不必担心会出现锯齿。

EOT – Embedded Open Type (.eot)

EOT是嵌入式字体,是微软开发的技术。允许OpenType字体用@font-face嵌入到网页并下载至浏览器渲染,存储在临时安装文件夹下。

OpenType (.otf)

OpenType是微软和Adobe共同开发的字体,微软的IE浏览器全部采用这种字体。致力于替代TrueType字体。

WOFF – Web Open Font Format (.woff)

WOFF(Web开发字体格式)是一种专门为了Web而设计的字体格式标准,实际上是对于TrueType/OpenType等字体格式的封装,每个字体文件中含有字体以及针对字体的元数据(Metadata),字体文件被压缩,以便于网络传输。

SVG (Scalable Vector Graphics) Fonts (.svg)

SVG是由W3C制定的开放标准的图形格式。SVG字体就是使用SVG技术来呈现字体,还有一种gzip压缩格式的SVG字体。使用方法:使用CSS3的@font-face属性可以实现在网页中嵌入任意字体。 但是IE只支持微软自有的EOT格式字体,需要用字体转换工具将其转换为EOT格式,其他浏览器都不支持这一字体格式,其它浏览器可以设置TTF(TrueType)和OTF(OpenType)两种字体作为自定义字体。

Bootstrap里的文件分别代表什么意思及其引用方法的更多相关文章

  1. Bootstrap里的文件作用

    Bootstrap里的文件分别表示什么?都有什么用? bootstrap.css bootstrap.min.css bootstrap-responsive.css bootstrap-respon ...

  2. Bootstrap里的文件分别表示什么?都有什么用?

    bootstrap.css 是完整的bootstrap样式表,未经压缩过的,可供开发的时候进行调试用bootstrap.min.css 是经过压缩后的bootstrap样式表,内容和bootstrap ...

  3. SQL Server里在文件组间如何移动数据?

    平常我不知道被问了几次这样的问题:“SQL  Server里在文件组间如何移动数据?“你意识到这个问题:你只有一个主文件组的默认配置,后来围观了“SQL Server里的文件和文件组”后,你知道,有多 ...

  4. SQL Server里的文件和文件组

    在今天的文章里,我想谈下SQL Server里非常重要的话题:SQL Server如何处理文件的文件组.当你用CREATE DATABASE命令创建一个简单的数据库时,SQL Server为你创建2个 ...

  5. Eclipse点击工程结构里任意文件或文件夹变拖动(或复制)的bug

    本文为原创文章,欢迎转载,但请注明出处http://www.cnblogs.com/yexiubiao/p/5204601.html,未在文章页面明显位置给出原文连接的,将保留追究法律责任的权利. 在 ...

  6. VS工程里的文件都是啥?如何打包? 2015-03-04

    打完补充:以下内容全部是我一家之言,只是愿意分享,内容如有不妥还请见谅. ====================================================== 刚才接收了一份代 ...

  7. 使用bootstrap的html文件转换成jsp…

    问题:使用bootstrap的html文件转换成jsp时表单高度变窄 解决方法: 将jsp中html文档类型修改为<!DOCTYPE html> 问题即可解决. 也就是bootstrap只 ...

  8. VS编辑代码的时候,都会自动在资源浏览器里将文件所在项目展开

    如何设置VS编辑代码的时候,都会自动在资源浏览器里将文件所在项目展开 工具-选项-项目和解决方案-常规-在解决方案资源管理器中跟踪活动项(C)

  9. 不安装rpm包,取出rpm包里的文件

    1.查看rpm包里的文件 [root@VM_166_132 ~]# rpm -qlp mysql5.6.29-1-3.x86_64.rpm |more/etc/ld.so.conf.d/mysql-5 ...

随机推荐

  1. JQuery Mobile - 固定住页面和页脚

    在点击页面空白时候,页眉和页脚会隐藏,在页眉和页脚加入以下代码就可以了: data-tap-toggle ="false" 例子: <div data-role=" ...

  2. 2018/7/26号碰到了个奇怪的问题(http有问题,但是ftp没毛病)

    过程大概是这样的 本来测试服务器中发ajax没问题,突然暴毙了,服务器又通过ajax发了另外一个请求(与之前不一样). nginx  reload 没毛病  ,ftp 也使用正常. 出了什么问题呢?  ...

  3. JavaScript在IE和Firefox的不兼容问题解决方法总结

    1.兼容Firefox的 outerHTML,Firefox中没有outerHtml的方法. if (window.HTMLElement) { HTMLElement.prototype.__def ...

  4. 注意:Tomcat Get请求的坑!

    Tomcat8.5,当Get请求中包含了未经编码的中文字符时,会报以下错误,请求未到应用程序在Tomcat层就被拦截了. Tomcat报错: java.lang.IllegalArgumentExce ...

  5. jquery选择器和属性

    jQuery的选择器 <html lang="en"> <head> <meta charset="UTF-8"> < ...

  6. Xamarin.Android 获取手机IP地址

    命名空间: using System.Net; 代码: IPAddress[] address = Dns.GetHostAddresses(Dns.GetHostName()); ] != null ...

  7. Intellij新安装初始化配置

    自动编译开关 忽略大小写开关 IDEA默认是匹配大小写,此开关如果未关.你输入字符一定要符合大小写.比如你敲string是不会出现代码提示或智能补充.但是,如果你开了这个开关,你无论输入String或 ...

  8. GNum试用体验

    只需在GNum上注册一个用户名,填上自己的电话号码,它就会自动生成一个URL,你的朋友(可以不注册GNum)在浏览器上进入这个 URL,就可以给你的手机打电话,目前可以免费通话200分钟,而且如果你邀 ...

  9. 使用maven构建多模块项目,分块开发

    在多人使用Maven协作开发项目时,尤其是稍微上点规模的项目,每个RD的工作都细分到具体功能和模块,有些模块甚至还要单独部署. 我们假设有这样一个商城项目,包括以下几个模块: 商城前台(shop) 管 ...

  10. thymeleaf 的使用

    thymeleaf 语法详解1.变量输出: th:text :在页面中输出某个值 th:value :将一个值放到input标签中的value中.2.判断字符串是否为空 ①:调用内置对象一定要用# ② ...