bootstrap开发响应式网页的常用的一些 类的说明
1.navbar-导航条
1.navbar-fixed-top,让导航条固定显示在页面上部(注意:固定的导航条会遮住代码,解决方案,给body设置padding-top的值【大于或等于】为我们导航条的实际高度,如我们nav的height为50px,我们设置body {padding-top:50px;},这样就可以避免导航条遮住我们的内容部分)
2.包含一个.container 或 container-fluid容器,导航条居中或者自适应显示
3.导航条默认.navbar-default是白底显示,如果想要显示黑底背景,给nav添加.navbar-inverse
2.dropdown-(下拉菜单)
3.carousel-滚动图片广告(轮播图)组件
4.Grid System-(栅格系统)图文列表--多栏布局简介
5.tabs-标签页
注:标签页是一个经常使用的内容,在网页上可以放置较多的内容,又可以 节省空间
6.modal-(模态框)-弹出框
注:模态框是一个经常使用的组件,一般用于弹出信息、确认信息和表单等内容。
7.打开标签页
$("#tablist a[href='点击的菜单项']").tab("show");
以上7种就是我们在构建网页中用的比较多的几种类型组件,多看文档多写文档,才能提高更快。
bootstrap开发响应式网页的常用的一些 类的说明的更多相关文章
- 使用bootstrap建立响应式网页——头部导航栏
1.要建立响应式网站的布局,这个时候bootstrap的高级就能体现出来了. 2.先来了解一下bootstrap提供了哪些响应式工具供我们使用: (1)屏幕宽度尺寸的概念: <768px ...
- 使用bootstrap建立响应式网页——通栏轮播图(carousel)
1.bootstrap提供了js插件——轮播图 我们还是照旧,直接拿过来用,需要改的地方再说. 2.修改 小屏幕看小图,大屏图看大图:这个可以利用自定义属性(data-XXX)data-img-lg( ...
- 7 个 Bootstrap 在线编辑器用于快速开发响应式网站
Bootstrap 已经使响应式网站开发变得简单很多. 但是如果你不必手动写全部代码,事情会如何呢? 如果你可以自由地选择你想要使用的Bootstrap 组件.并可以把它们拖拽到画布中,事情会如何呢? ...
- bootstrap响应式网页设计的9条基本原则!
bootstrap响应式网页设计是针对多屏幕问题的一个很好的解决方案,但从印刷的视角来看有点困难.没有固定的页面尺寸,没有毫米或英寸,没有任何的物理限制,无从下手. 为了desktop和mobile单 ...
- 学习笔记1--响应式网页+Bootstrap起步+全局CSS样式
一.学习之前要了解一些背景知识: 在2g时代,3g时代,4g时代,早期的网页浏览设备,功能机,智能机.(本人最喜欢的透明肌,和古典黑莓机) 1.什么是响应式网页? Responsive Web Pag ...
- 使用Bootstrap 3开发响应式网站实践04,使用Panels展示内容
在Bootstrap页面中,通常用Panels来展示主要功能的内容.该部分Html为: <div class="row" id="featureHeading&qu ...
- BootStrap学习之先导篇——响应式网页
Bootstrap学习之前,要知道响应式网页的原理. 1.什么是响应式网页? 一个页面,可以根据浏览设备的不同,以及特性的不同,而自动改变布局.大小等.使得在不同的设备上上都可以呈现优秀的界面. 优点 ...
- 使用Bootstrap 3开发响应式网站实践07,页脚
页脚部分比较简单,把一个12列的Grid切分. <footer> <div class="container"> <div class="r ...
- 使用Bootstrap 3开发响应式网站实践06,使用ListGroup、Thumbnails展示内容
□ ListGroup展示内容 当希望把同类型的内容以列表.区块展示的时候,ListGroup是不错的选择. <div class="col-sm-6"> <h3 ...
随机推荐
- List集合总结,对比分析ArrayList,Vector,LinkedList
前面已经写了三篇关于Java集合的文章,包括: Java集合 ArrayList原理及使用 再说Java集合,subList之于ArrayList Java集合 LinkedList的原理及使用 关于 ...
- sqlserver 表值函数与标量值函数
除了在我们常用的程序开发中要用到函数外,在sql语句中也常用到函数,不论哪种,思想都没有变,都是为了封装,可复用. 创建的方法和整体结构都大体相同,都少不了函数名,函数的形参,返回值等这些. 一.表值 ...
- python logging模块使用总结
目录 logging模块 日志级别 logging.basicConfig()函数中的具体参数含义 format参数用到的格式化信息 使用logging打印日志到标准输出 使用logging.base ...
- 2018.8.19 2018暑假集训之maxnum
昨天去做志愿服务去了没写成Q_Q 今天再来一道 先放题面描述 设有n个正整数(n<=20),将它们联成一排,组成一个最大的多位数 设有n个正整数(n<=20),将它们联成一排,组成一个最大 ...
- Easy doesn't enter into grown-up life
Hi xinlu, good afternoon, my name is xx, you can also call me andrew. i'm 31 years old, and i'm from ...
- 西门子S7-1200与 G120系列变频器USS通信
西门子S7-1200 紧凑型PLC在当前的市场中有着广泛的应用,作为经常与SINAMICS G120系列变频器共同使用的PLC,其USS通信协议的使用一直在市场上有着非常广泛的应用.本文将主要介绍如何 ...
- VC win32 static library静态链接库简单示例
中午在宿舍闲来没事,看到网上一篇帖子,关于静态链接库的英文示例.它在.Net上开发,我将其移到VC上开发,因此对其代码做了相应修改.帖子内容如下:(代码我已修改).原帖见:http://msdn.mi ...
- 20140117-配置文件为什么放在UI层
配置文件为什么放在UI层 (刚才写着代码突然忘了配置文件为什么要放在UI层了,只记得晓虎老师强调过.找了半天视频……) 现总结一下: 晓虎老师给出的理由,大体如下:比如一个web项目,分成三层,DAL ...
- BI之路学习笔记2--SSIS/ETL设计练习三:《DB->定期生成excel表》
上次笔记记到,用sql任务给参数赋值,映射到变量,然后把数据流任务放到序列容器中进行执行,可以定期生成excel, 现在的问题是: 在EXCEL目标编辑过程中,必须选定某一个特定的excel目标,这样 ...
- mvc区分页面内请求判断是否是Html.action或Html.RenderAction请求
ControllerContext.IsChildAction 来判断,如果用Html.Action或Html.RenderAction方法,这个属性返回true,否则返回false