随笔分类 -  Bootstrap

1
关于bootstrap在IE8中错误提示：Bootstrap's JavaScript requires jQuery的解决办法
摘要：虽然有些同仁们是先引用jquery后才引用bootstap的css样式出现此提示，但我的是由于jquery版本太高用的是2.1.4的， 于是便想到bootstrap官方去右键查看源码引用的jquery版本，既然是此版本：1.10.2的版本，于是下载替换此版本的jquery错误消失！ 阅读全文
posted @ 2015-12-24 09:31 objnet 阅读(440) 评论(0) 推荐(0)
Bootstrap中tooltip的使用
摘要：首先的把相关样式和脚步文件引入，其次是激活tooltip:$(function(){$("[data-toggle='tooltip']").tooltip();});js代码： View Codehtml代码： hover m... 阅读全文
posted @ 2015-09-27 23:41 objnet 阅读(484) 评论(0) 推荐(0)
Bootstrap轮播Carousel样式的应用
摘要：bootstrap轮播效果 ... 阅读全文
posted @ 2015-09-17 00:32 objnet 阅读(406) 评论(0) 推荐(0)
Bootstrap中过渡效果（Transition）模态框插件的使用案例
摘要：通过使用模态框效果实现弹出框的登录效果： 效果图： 过渡效果（Transition）模态框插件的使用案例： 登录 ... 阅读全文
posted @ 2015-09-06 21:45 objnet 阅读(697) 评论(0) 推荐(0)
Bootstrap中well的使用
摘要：作用：Well 是一种会引起内容凹陷显示或插图效果的容器 。 Bootstrap中well的使用 I'm well. I'm well. I'm well... 阅读全文
posted @ 2015-09-01 22:09 objnet 阅读(591) 评论(0) 推荐(0)
Bootstrap中多媒体对象Media的使用
摘要：第一、基本的多媒体对象Media-Object：可用在图片的解说，论坛的留言上etc 基本的多媒体对象实例 ... 阅读全文
posted @ 2015-09-01 00:11 objnet 阅读(783) 评论(0) 推荐(0)
Bootstrap中进度条的使用
摘要：普通的进度条 40% compelete 交替的进度条 60% compelete 50% compelete 40% compelete 30% compelete 条纹的进度条 60% compelete 50% compelete... 阅读全文
posted @ 2015-08-28 23:08 objnet 阅读(562) 评论(0) 推荐(0)
Bootstrap中面包屑导航实例
摘要：通过重写样式breadcrumb可以更改分割的符默认是单斜杠，实例重写后是双斜杠：代码实例： 面包屑导航 人类 男 女 效果图如下： 阅读全文
posted @ 2015-08-27 22:36 objnet 阅读(1933) 评论(0) 推荐(0)
Bootstrap中导航的使用
摘要：标签式导航的应用 C C++ Java C# PHP 胶囊式导航的应用 C C++ Java C# PHP 垂直式导航的应用 C C++ Java C# PHP 标签式导航的应用 C C++ Java C# PHP 胶囊式导航的应用 C C++ Java ... 阅读全文
posted @ 2015-08-26 23:31 objnet 阅读(355) 评论(0) 推荐(0)
Bootstrap标签（label）的使用
摘要：基本的标签和带语境的标签：default标签danger标签info标签primary标签success标签warning标签*变大可以有-标签包起来；效果图如下： 阅读全文
posted @ 2015-08-24 00:11 objnet 阅读(4680) 评论(0) 推荐(0)
Bootstrap图片的应用
摘要：主要有三种效果：第一、 img-rounded：通过添加border-radius:6px使得图片呈现圆角(IE8不支持)第二、img-circle:通过添加border-radius:500px使得图片变成圆形（IE8不支持）第三、 img-thumbnail:通过添加padding和一个灰色的边... 阅读全文
posted @ 2015-08-22 00:44 objnet 阅读(230) 评论(0) 推荐(0)
Bootstrap分页
摘要：第一、基本的分页：«123»第二、不可点击页面和当前页面的显示：«123»第三、分页样式从大到小的显示：«123»«123»«123»第四、基本的翻页：previousnext第... 阅读全文
posted @ 2015-08-19 00:27 objnet 阅读(461) 评论(0) 推荐(0)
bootstrap中的按钮组
摘要：第一、基本的按钮组：default按钮 success按钮第二、按钮组工具条（包含多个按钮组）及控制按钮组大小：info按钮danger按钮warning按钮primary按钮info按钮danger按钮第三、垂直排列的按钮组：info按钮success按钮danger按钮第四、内嵌按钮组和下拉菜单... 阅读全文
posted @ 2015-08-18 00:08 objnet 阅读(319) 评论(0) 推荐(0)
Bootstrap中面板的使用
摘要：基本面板：基本的面板不带title的面板标题：不要title的面板标题基本的面板带标题的面板：由到来修饰：带title的面板标题带title的面板内容带语境色彩的面板：面板标题面板带表格的面板：带表格的面板标题带表格的面板内容名称数量 手机8 电脑4 带列表组的面板：带列表组的标题带列表组的内容第一... 阅读全文
posted @ 2015-08-17 00:52 objnet 阅读(360) 评论(0) 推荐(0)
Bootstrap中下拉菜单的用法
摘要：编程语言//下来按钮//小三角图片 //pull-right即显示的下来菜单靠右。默认是pull-left靠左位于下拉按钮下见图示 //aria-labelledby用于提示屏幕阅读器显示对应的作用idJava//tabindex="-1" 即切换tab键时不显示，如值为1，2，3的话恰换tab键时... 阅读全文
posted @ 2015-08-16 00:48 objnet 阅读(456) 评论(0) 推荐(0)
Bootstrap中alerts的用法
摘要：警告alerts的使用：用于提示用户相关信息。基本的显示方式有四种分别对应的是：(信息)alert-info、（成功）alert-success、（危险）alert-danger、（警告）alert-warning.示例代码：文字的信息提示成功的信息提示危险的信息提示警告的信息提示效果图如下： 在写... 阅读全文
posted @ 2015-08-15 01:01 objnet 阅读(1049) 评论(0) 推荐(0)
Bootstrap HTML编码规范总结
摘要：摘自： http://www.runoob.com，纯粹是为了加强Bootstrap框架的学习语法： 1.用两个空格来代替制表符tab--为了在不同的浏览器和系统作用下展现一致。2.嵌套元素应当缩进一次(即2个空格)；3.对属性的定义全部用双引号，绝不用单引号。 4.不要在自闭合（self-clos... 阅读全文
posted @ 2015-08-14 01:09 objnet 阅读(345) 评论(0) 推荐(0)
Bootstrap中img-circle glyphicon及js引入加载更快的存放位置
摘要：第一：响应式椭圆图像的应用 效果图如下：第二：图标的应用：搜索图标：打印图标：下载图标：云图标：信件图标：警告图标：文本居中对齐图标：由于图标太多这里就不一一列举，值得注意的是有些图标需要引入fonts文件夹，如上面的几个图标中除开云图标和信件图标外，其他图标不引入正确的fonts文件库将导致无... 阅读全文
posted @ 2015-08-11 00:00 objnet 阅读(754) 评论(0) 推荐(0)
Bootstrap中样式Jumbotron，row, table的实例应用
摘要：之前只是大概预览了下Bootstrap中涉及到的相关元素，插件等的使用。接下来将通过实例演练加强对Bootstrap的了解。实例来自http://www.runoob.com/有兴趣的可以上去学习跟w3cschool上的差不多。 为了加深理解，决定先在本地用google浏览器测试后，再写到这里。加... 阅读全文
posted @ 2015-08-09 18:49 objnet 阅读(1427) 评论(0) 推荐(0)
Bootstrap预览篇
摘要：Designed for everyone, everywhere. Bootstrap makes front-end web development faster and easier. It's made for folks of all skill levels, devices ofal... 阅读全文
posted @ 2015-08-02 23:47 objnet 阅读(542) 评论(0) 推荐(0)

1