bootstrap 笔记
导航条:
div.navbar.navbar-default > ul.nav.navbar
无非两层:
父div:
navbar {相对位置、最低高度50px、下部margin:20px、透明边框}
navbar-default{设置背景、设置边框}
子ul:
.navbar-nav { //这个主要作用是:设置下部a标签字体高度。
margin: 7.5px -15px;
}
.navbar-nav > li > a {
padding-top: 10px;
padding-bottom: 10px;
line-height: 20px;
} .navbar > li { left 浮动} .nav {
padding-left: 0;
margin-bottom: 0;
list-style: none; // 首先去掉列标
}
.nav > li {
position: relative;
display: block;
}
.nav > li > a {
position: relative;
display: block;
padding: 10px 15px;
}
类淘宝-MENU
div.navbar.navbar-default>div.navbar-header>a.navbar-brand{菜单标题}+button.navbar-toggle[data-toggle="collapse" data-target=".navbar-collapse-toggle"]>span.icon-bar*3^^div.collapse.navbar-collapse.navbar-collapse-toggle>ul.navbar-nav.nav>(li>a[href="#"]{菜单项-$})*5
// navbar-inverse
网格系统:

bootstrap 笔记的更多相关文章
- Bootstrap笔记--快速入门
首先是Bootstrap的简介: 业余了解:下面这个网址可以查询IP地址的地理位置 下面学习:(具体可以参考Bootstrap中文网) 栅格系统 Bootstrap 提供了一套响应式.移动设备优先的流 ...
- 【巩固】Bootstrap笔记三
这段笔记介绍了bootstrp中以下几点应用点: 警告框的使用 面板功能 运用chart.js制作图表 进度条的制作 媒体对象的制作 有一个元素如果有属性alert-dismissible" ...
- 【巩固】Bootstrap笔记一
这两天开始重新巩固一下bootstrap的学习,群里有朋友介绍说麦子学院的教程不错,特地看了一下,有2个项目练习,所以跟着做了一下,下面开始笔记. <button class="nav ...
- 【巩固】bootstrap笔记二
这段主要记录如何给排版完的页面加一些动画效果,用到了的插件有: wow.min.js jquery.singlePageNav.min.js animate.css 将导航条上对应的菜单和页面上对应的 ...
- 深入理解Bootstrap笔记
框架介绍 1.框架简介 2.CSS基本语法 3.JavaScript基本语法 4.Bootstrap整体架构 5.12栅格系统 6.CSS组件架构设计思想 7.JavaScript插件架构 CSS布局 ...
- bootstrap笔记-布局
1.通过文本对齐类,可以简单方便的将文字重新对齐. <p class="text-left">Left aligned text.</p> <p cl ...
- bootstrap 笔记01
bootstrap源码样式: 移除body的margin声明设置body的背景色为白色为排版设置了基本的字体.字号和行高设置全局链接颜色,且当链接处于悬浮“:hover”状态时才会显示下划线样式 1, ...
- Bootstrap笔记合集
一. 为了简化操作,方便使用,Bootstrap通过定义四个类名来控制文本的对齐风格: ☑ .text-left:左对齐 ☑ .text-center:居中对齐 ☑ .text-right ...
- Bootstrap笔记-加强版
1.bootstrap引入: <!DOCTYPE html><html lang="zh-cn"><head><meta charset= ...
- 后端小白的Bootstrap笔记 一
栅格系统 下面这张图是Bootstrap对栅格系统有关系数的规定 什么是栅格体统? 栅格系统是Bootstrap提供的移动优先的网格系统, 各个分界点如上: 576px 720px 992px 120 ...
随机推荐
- 【C#】【Thread】SpinLock
SpinLock结构是一个低级别的互斥同步基元,它在等待获取锁时进行旋转. 在多核计算机上,当等待时间预计较短且极少出现争用情况时,SpinLock 的性能将高于其他类型的锁. 不过,我们建议您仅在通 ...
- linux 安全狗
下载 ;安装; service safedog start 或者 sdstart;sdui
- WebApi 接口参数不再困惑:传参详解
阅读目录 一.get请求 1.基础类型参数 2.实体作为参数 3.数组作为参数 4.“怪异”的get请求 二.post请求 1.基础类型参数 2.实体作为参数 3.数组作为参数 4.后台发送请求参数的 ...
- gradle项目中profile的实现
gradle中并没有直接类似maven中的profile支持,只能变通的用其它方法来处理,在打包不同环境的应用时,通常会遇到二类问题: 一.不同的环境依赖的jar包不同 拿web开发来说,生产环境一般 ...
- React基础知识
学习文档(按优先级排列)http://reactjs.cn/react/docs/tutorial-zh-CN.htmlhttp://www.cnblogs.com/Mrs-cc/p/4969755. ...
- Windows phone应用开发[18]-下拉刷新
在windows phone 中采用数据列表时为了保证用户体验常遇到加载数据的问题.这个问题普遍到只要你用到数据列表就要早晚面对这个问题. 很多人会说这个问题已经有解决方案. 其实真正问题并不在于如何 ...
- Nginx搭建https服务器
HTTPS简介 HTTPS(Hypertext Transfer Protocol over Secure Socket Layer),是以安全为目标的HTTP通道,简单来讲就是HTTP的安全版.即H ...
- html中的rel,rev是什么?
html中的rel,rev是什么? 这2个标记主要是用于表示文档之间的联系,rel是从源文档到目标文档的关系:rev是从目标文档到源文档的关系 经常用到的属性如下: Alternate - 定义交替出 ...
- python异常处理
1. 异常 (1) 异常处理 #没有异常处理 num = int('abc') print(num) #报错 #异常处理 try: num = int('abc') #try里的代码是受保护的 pri ...
- Git 学习笔记参考
1.参考学习资料 网上资料: http://www.cnblogs.com/aoguren/p/4189086.html http://www.liaoxuefeng.com/wiki/0013739 ...