bootstrap怎么引用本地css的bootstrap.min.css？

来源：蜘蛛抓取(WebSpider) 时间：2017-01-25 16:10 标签： html引用本地css文件
开始使用 & Bootstrap Table
假如您喜欢 Bootstrap Table：
问题/帮助：
来安装和管理 Bootstrap table 的 CSS，JavaScript, 多语言和扩展。
$ bower install bootstrap-table
下载的 Bootstrap table 源码包含了未压缩的 CSS，JavaScript，语言文件以及扩展，并且提供了压缩扰乱的 min 文件，当然也提供了我们的文档。更具体地说，主要包含了以下的文件：
bootstrap-table/
├── dist/
├── extensions/
├── locale/
├── bootstrap-table.min.css
└── bootstrap-table.min.js
├── docs/
└── src/
├── extensions/
├── locale/
├── bootstrap-table.css
└── bootstrap-table.js
src/，locale/ 和 extensions/ 是我们的 CSS，JavaScript 的源码。dist/文件夹包含了所有src/下压缩并扰乱的文件。docs/文件夹包含了我们文档的源码。另外，我们提供了包信息，License 信息，和其他的信息。
编译 CSS 和 JavaScript
Bootstrap table 使用
来作为编译系统，可以用十分方便的方法来编译我们代码，或者文档等等。
安装 Grunt
安装 Grunt，你必须先
(包含 npm)。npm 是
管理工具。
然后，我们使用命令行：
安装全局的 grunt-cli，使用 npm install -g grunt-cli 命令即可。
进入到 /bootstrap-table/ 的根目录，然后运行 npm install。npm 将通过查找 package.json 文件并自动安装这里所需要的依赖。
完成之后，你就可以运行一下的命令来编译的代码了。
可以用的 Grunt 命令
grunt dist (编译 CSS 和 JavaScript)
这里我们会生成 /dist/ 文件夹。 As a Bootstrap user, this is normally the command you want.
grunt test (运行 tests)
来测试我们的代码。
grunt docs (编译和测试文档)
编译和测试 CSS，JavaScript，本地我们可以通过 jekyll serve 来运行我们的文档。
grunt (编译所有并运行测试)
压缩和扰乱 CSS 和 JavaScript，测试，编译文档等等。依赖 。
如果你安装或运行依赖是遇到问题，首先删除 /node_modules/ npm 生成的文件夹。然后，再运行一次 npm install 即可。
引入 Bootstrap 库（假如你的项目还没有使用）和 bootstrap-table.css 到 head 标签下。
&link rel="stylesheet" href="bootstrap.min.css"&
&link rel="stylesheet" href="bootstrap-table.css"&
引入 jQuery 库，bootstrap 库（假如你的项目还没有使用）和 bootstrap-table.js 到 head 标签下或者在 body 标签关闭之前（一般建议这么做）。
&script src="jquery.min.js"&&/script&
&script src="bootstrap.min.js"&&/script&
&script src="bootstrap-table.js"&&/script&
&-- put your locale files after bootstrap-table.js --&
&script src="bootstrap-table-zh-CN.js"&&/script&
通过 data 属性或者 JavaScript 来启用 Bootstrap Table 插件，显示丰富的功能。
通过 data 属性的方式
无需编写 JavaScript 启用 bootstrap table，我们对普通的 table 设置 data-toggle=&table& 即可。
&table data-toggle="table"&
&th&Item ID&/th&
&th&Item Name&/th&
&th&Item Price&/th&
&td&1&/td&
&td&Item 1&/td&
&td&$1&/td&
&td&2&/td&
&td&Item 2&/td&
&td&$2&/td&
我们也可以通过设置远程的 url 如
data-url=&data1.json& 来加载数据。
&table data-toggle="table" data-url="data1.json"&
&th data-field="id"&Item ID&/th&
&th data-field="name"&Item Name&/th&
&th data-field="price"&Item Price&/th&
通过 JavaScript 的方式
通过表格 id 来启用 bootstrap table。
&table id="table"&&/table&
$('#table').bootstrapTable({
columns: [{
field: 'id',
title: 'Item ID'
field: 'name',
title: 'Item Name'
field: 'price',
title: 'Item Price'
name: 'Item 1',
price: '$1'
name: 'Item 2',
price: '$2'
我们也可以通过设置远程的 url 如
url: 'data1.json' 来加载数据。
$('#table').bootstrapTable({
url: 'data1.json',
columns: [{
field: 'id',
title: 'Item ID'
field: 'name',
title: 'Item Name'
field: 'price',
title: 'Item Price'【求助】关于bootstrap.min.css覆盖了自己的css_css吧_百度贴吧
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&签到排名：今日本吧第个签到，本吧因你更精彩，明天继续来努力！
本吧签到人数：0成为超级会员，使用一键签到本月漏签0次！成为超级会员，赠送8张补签卡连续签到：天&&累计签到：天超级会员单次开通12个月以上，赠送连续签到卡3张
关注：48,435贴子：
【求助】关于bootstrap.min.css覆盖了自己的css收藏
这是只引入自己的base.css的样式页面1：页面2在这基础上引入了bootstrap.min.css后。样式就变成了：字体和居中方式都改变了。尝试过的方法：!important，无效；
更改base.css中的样式名避免同名覆盖，同样无效。有大神知道这是什么原因吗？或者说怎么能让页面2也达到页面1的效果？
登录百度帐号推荐应用
为兴趣而生，贴吧更懂你。或下次自动登录
现在的位置:
& 综合 & 正文
添加Bootstrap 到MVC项目中
环境：Visual Studio 2010
ASP.NET MVC3
手动添加： 下载地址：
一个js,两个css,两张图
obootstrap.min.js
CSS 文件：
obootstrap.min.css
obootstrap-responsive.min.css
image 文件：
oglyphicons-halflings.png
oglyphicons-halflings-white.png
obootstrap.js
obootstrap.css
obootstrap.responsive.css 是带 min 关键字的文件的对应源码，min 是其压缩文件。我们在项目中只需要添加带 min 关键字的文件。
或者使用 NuGet Package Manager 加入到项目
_Layout.cshtml 中添加：
&link href="@Url.Content("~/Content/bootstrap.min.css")" rel="stylesheet" type="text/css" /&
&link href="@Url.Content("~/Content/bootstrap-responsive.min.css")" rel="stylesheet" type="text/css" /&
&script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript"&&/script&
&script src="@Url.Content("~/Scripts/bootstrap.min.js")" type="text/javascript"&&/script&
&&&&推荐文章:
【上篇】【下篇】

我要回帖

更多关于 html引用本地css文件 的文章

 

随机推荐