1.ie8不支持carousel组件,

解决方法:将jquery换为jquery1版本,具体原因不清楚~~~~~

2.ie8不支持background-color:rgba();

解决方法:这样写代码:

.carousel-indicators li{
width:24px;
height:24px;
margin-right:20px;
border-radius:24px;
background:rgba(255,255,255,.3);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4cffffff,endColorstr=#4cffffff);}

 background:rgba(255,255,255,.3);

  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4cffffff,endColorstr=#4cffffff);

rgba的含义,r代表red,g代表green,b代表blue,红绿蓝是三原色。所有颜色都可以由这三种颜色拼合而成。a代表透明度。比如rgba(255,255,255,0.1)就是透明度为0.1的白色。在现代浏览器中是支持rgba的。但是在ie8等古董级浏览器中是不支持的rgba的,ie8只能勉强支持rgb()函数(即去掉了透明度,只能表示颜色)。

大家注意,这个颜色“#19ffffff”是由两部分组成的。

第一部是#号后面的19 。是rgba透明度0.1的IEfilter值。从0.1到0.9每个数字对应一个IEfilter值。对应关系如下:

第二部分是19后面的六位 。这个是六进制的颜色值。要跟rgb函数中的取值相同。比如rgb(255,255,255)对应#ffffff;都是白色。

到这里,rgba的用法就可以兼容IE8了。

3.col-?-push-X,col-?-pull-X的用法

简单来说,col-??-push-*和col-??-pull-*,主要起改变元素在大屏幕页面上的显示位置的作用,对于手持设备的小屏幕显示(也就是堆叠的列的顺序或者说位置),会严格按照html代码的先后顺序显示,那么我们自然就知道用法了:在html里面,把要先显示的内容写在前面,后显示的内容写在后面,然后用push和pull对它们在大屏幕上的左右位置进行调整,例子如下:

<div class=’col-12 col-sm-9 col-sm-push-3′>//这个div占了9个栅格,先写,让它在手持设备上可以先显示,然后用push往右推3个栅格,让它在大屏幕显示在右边。

<div class=’col-6 col-sm-3 col-sm-pull-9′> //这个div占了3个栅格,后写,让它在手持设备上后显示,然后用ull往左拉9个栅格,让它在大屏幕显示在左边。

就这么简单。通过使用.col-md-push-* 和 .col-md-pull-*就可以很容易的改变列的顺序。

提示:http://gsls.info/

http://www.cnblogs.com/linjiqin/p/3559800.html

4.bootstrap做网页不要轻易定div快的高度,因为bootstrap是移动端优先,若定义了高度,移动端会出现布局混乱,需用@media(){}来定义移动端的样式

bootstrap使用中遇到的问题(二)的更多相关文章

  1. Bootstrap框架的学习(二)

    一.下载Bootstrap Bootstrap (当前版本 v3.3.0)提供以下几种方式帮你快速上手,每一种方式针对具有不同技能等级的开发者和不同的使用场景. 下载地址:http://v3.boot ...

  2. bootstrap快速入门笔记(二)-栅格系统,响应式类

    一,栅格系统大致有以下: 1,行row必须包含在 .container (固定宽度)或 .container-fluid (100% 宽度)中,一行有12列 2.“列(column)”在水平方向创建一 ...

  3. bootstrap基础学习小记(二)排版、列表、代码风格、表格

    排版——标题.副标题.段落(正文文本).强调内容.粗体.斜体.强调相关的类.文本对齐 <!DOCTYPE HTML> <html> <head> <meta ...

  4. Bootstrap Metronic 学习记录(二)菜单栏

    1.简介 1)  .环境配置 2)  .提取页面 2).动态生成菜单(无限级别树) 2.系统环境配置 项目需要程序数据支撑,这里选择MVC5.0+EF6.0[SQLSERVER](不对MVC架构和SQ ...

  5. Bootstrap基本类和组件学习二

    一.联系方式:(自带鼠标的移动动画) 1.头文件CSS <link rel="shortcut icon" href="favicon.ico"> ...

  6. BootStrap 智能表单系列 二 BootStrap支持的类型简介

    代码如下(链接地址:https://github.com/xiexingen/Bootstrap-SmartForm/blob/master/demo/form1-basic.html): <! ...

  7. 《深入理解Bootstrap》读书笔记(二)

    列表 1.普通列表 普通列表的使用没有什么变化,只是在原本的基础上对margin和行间距做了一些调整. 2.有序列表 有序列表的使用也是没有什么变化,只是在原本的基础上对margin和行间距做了一些调 ...

  8. bootstrap使用中遇到的坑

    一.例如: <div class="form-group"> <label class="control-label col-lg-3"> ...

  9. Bootstrap关于表单(二):水平表单

    Bootstrap框架默认的表单是垂直显示风格,但很多时候我们需要的水平表单风格(标签居左,表单控件居右) 在Bootstrap框架中要实现水平表单效果,必须满足以下两个条件: 1.在<form ...

随机推荐

  1. 涂抹Oracle笔记1-创建数据库及配置监听程序

    一.安装ORACLE数据库软件及创建实例OLTP:online transaction processing 指那些短事务,高并发,读写频繁的数据库系统.--DB_BLOCK_SIZE通常设置较小.O ...

  2. EffectiveC#02--仅在对基类进行强制更新时才使用new修饰符

    1.建议避免使用new修饰符来重新定义非虚函数. 非虚方法是静态绑定的,不管哪里的代码也不管在哪里引用, 它总是严格的调用类中所定义的函数.并不会在运行时在 派生类中查找不同的版本. 2.何时使用ne ...

  3. hbase权威指南学习笔记--架构--存储

    HBase主要处理两种文件:预写日志(Write-Ahead Log,WAL),实际的数据文件. 一个基本的流程是客户端首先联系ZooKeeper子集群查找行健数据所在的region服务器名.(通过Z ...

  4. Visual Studio 2013 Web开发、新增功能:“Browser Link”

    微软正式发布Visual Studio 2013 RTM版,微软还发布了Visual Studio 2013的最终版本..NET 4.5.1以及Team Foundation Server 2013. ...

  5. java web移植 遇到Project facet Java version 1.7 is not supported

    在移植eclipse项目时,如果遇到 "Project facet Java version 1.7 is not supported." 项目中的jdk1.7不支持.说明项目是其 ...

  6. 实战 Spring MVC接入支付宝即时到账 (部分代码)

    下面就拿我项目中的部分代码来实践一下. 支付请求 首先,是提交表单 fund.jsp(这里我表单只需要用户填交易金额,其他的订单号之类的全部后台生成) <form id="deposi ...

  7. typecho博客出404页面修改方法

    适用于typecho博客版本为:0.9 (13.12.12) typecho博客,很多时候可能安装完毕,除了首页,其他页面都是404=.= 在匹配*.php的location区域修改为以下格式: lo ...

  8. Knight Moves(BFS,走’日‘字)

    Knight Moves Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Tota ...

  9. Azure File文件共享(6):使用Python开发

    Azure文件共享服务提供了多种方式的访问接口,包括Powershell,.Net, Java, Python等等,本章主要介绍如何使用Python来访问Azure File存储. 关于Python环 ...

  10. js判断字符串中的英文和汉字

    有时需要判断一个字符是不是汉字,比如在用户输入含有中英文的内容时,需要判断是否超过规定长度就要用到.用 Javascript 判断通常有两种方法. 方法一 正则表达式,test()方法返回true 或 ...