bootstrap
honey琛
自学的小白
展开
-
Bootstrap导航条、分页导航
导航条基础导航条(navbar)和上一篇介绍的导航(nav),就相差一个字,多了一个“条”字。其实在Bootstrap框架中他们还是明显的区别。在导航条(navbar)中有一个背景色、而且导航条可以是纯链接(类似导航),也可以是表单,还有就是表单和导航一起结合等多种形式。<!--基本导航条--><div class="navbar navbar-default" role="navigation"原创 2016-09-09 17:04:00 · 841 阅读 · 0 评论 -
Bootstrap其他内置组件(一)
缩略图缩略图在网站中最常用的地方就是产品列表页面,一行显示几张图片,有的在图片底下(左侧或右侧)带有标题、描述等信息。Bootstrap框架将这一部独立成一个模块组件。并通过“thumbnail”样式配合bootstrap的网格系统来实现。可以将产品列表页变得更好看。 通过“thumbnail”样式配合bootstrap的网格系统来实现。<div class="container"> <d原创 2016-09-10 11:28:54 · 1099 阅读 · 0 评论 -
Bootstrap其他内置组件(二)
媒体对象–默认媒体对象媒体对象一般是成组出现,而一组媒体对象常常包括以下几个部分:媒体对像的容器:常使用“media”类名表示,用来容纳媒体对象的所有内容媒体对像的对象:常使用“media-object”表示,就是媒体对象中的对象,常常是图片媒体对象的主体:常使用“media-body”表示,就是媒体对像中的主体内容,可以是任何元素,常常是图片侧边内容媒体对象的标题:常使用“media-he原创 2016-09-11 15:04:44 · 492 阅读 · 0 评论 -
Bootstrap其他内置组件(三)
面板–基础面板基础面板非常简单,就是一个div容器运用了“panel”样式,产生一个具有边框的文本显示块。由于“panel”不控制主题颜色,所以在“panel”的基础上增加一个控制颜色的主题“panel-default”,另外在里面添加了一个“div.panel-body”来放置面板主体内容:<div class="panel panel-default"> <div class="pane原创 2016-09-12 14:45:03 · 871 阅读 · 0 评论 -
Bootstrap基础
在百度上面搜索Bootstrap,有一个中文的网站,点击下载,有两个选择,下载Bootstrap源代码或者使用 Bootstrap 中文网提供的免费 CDN 加速服务. 我的选择是第二中:<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css"><!-- jQuery文件。原创 2016-09-06 11:07:49 · 555 阅读 · 0 评论 -
Bootstrap表单
在这个文章中记录Bootstrap的表单的样式的使用表单<form role="form"> <div class="form-group"> <label for="exampleInputEmail1">邮箱:</label> <input type="email" class="form-control" id="exampleInputEmail1" placeholde原创 2016-09-07 10:55:10 · 3076 阅读 · 6 评论 -
Bootstrap网格系统
实现原理网格系统的实现原理非常简单,仅仅是通过定义容器大小,平分12份(也有平分成24份或32份,但12份是最常见的),再调整内外边距,最后结合媒体查询,就制作出了强大的响应式网格系统。Bootstrap框架中的网格系统就是将容器平分成12份。<!--css代码-->[class *= col-]{ background-color: #eee; border: 1px solid #cc原创 2016-09-07 15:58:31 · 1087 阅读 · 0 评论 -
Bootstrap菜单,按钮及导航
下拉菜单特别声明:因为Bootstrap的组件交互效果都是依赖于jQuery库写的插件,所以在使用bootstrap.min.js之前一定要先加载jquery.min.js才会生效果。 <div class="dropdown"> <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" da原创 2016-09-08 17:27:40 · 1693 阅读 · 0 评论 -
css去掉背景颜色
只需要在已经设置好背影颜色的代码上加上 background-color:transparent; 就解决了!原创 2017-09-21 17:21:23 · 56854 阅读 · 0 评论