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. ASP.Net请求处理机制初步探索之旅 - Part 1 前奏(转)

        在读本文之前建议先阅读IIS架构:http://www.cnblogs.com/tiantianle/p/5079932.html     不管是ASP.Net WebForm还是ASP.Ne ...

  2. HTML与CSS入门——第二章 发布Web内容

    知识点: 1.使用文本编辑器创建一个基本的HTML文件的方法 2.使用FTP将文件传送到你的Web服务器的方法 3.文件在Web服务器上应该存储的位置 4.在没有Web服务器的情况下分发Web内容的方 ...

  3. Toolbar 和 CollapsingToolbarLayout一起使用时menu item无点击反应解决办法

    昨天一直在琢磨为什么Toolbar和CollapsingToolbarLayout一起使用时menu item无点击放应的原因,后来在stackoverflow上一条回答,说可能是Toolbar的背景 ...

  4. xcode 7 添加空模板

    文件下载链接: http://pan.baidu.com/s/1pKbyf4R 密码: ppi7 下载完成后将模板放入以下路径应用程序->Xcode->右键显示包内容->/Conte ...

  5. iconv编码转换指令

    看到一个不错的指令iconv,可以对文件编码进行转换,记录如下: iconv --list 列出所有支持转换的编码 icon -f code1 -t code2 filename -o newfile ...

  6. 给Array添加删除重复元素函数

    给Array本地对象增加一个原型方法,它用于删除数组中重复的元素(可能有多个重复), 返回值是一个包含被删除的重复条目的新数组. Array.prototype.distinct = function ...

  7. jQuery中的$.extend方法总结

    原文见:jQuery.extend()函数详解 Jquery的扩展方法extend是我们在写插件的过程中常用的方法,但是经常容易搞不清楚以下两个写法的关系: 1.$.extend(dest,src1, ...

  8. php ajax 同时验证 用户名 密码

    今天写了一个程序分享给大家,该程序是ajax密码和用户名验证问题 第一步 先在数据库里建立一张表 有3个字段 为 id name pass 第二步 写html页面,需要引入jq库 请到官网自行下载 & ...

  9. WAMPSERVER2.2 无法启动的解决!

    转: PHP版本:5.3.10 XDEBG插件:php_xdebug-2.1.2-5.3-vc9.dll WAMPServer2.2用的是VC9编译的,并且需要VC9运行库支持. 此问题解决方法: 下 ...

  10. 用PHP向MySql中写入图片

    我们经常遇到的问题是如何将图片文件放到Mysql数据库当中,这样可以避免没有认证的用户找到我们的图片资源! 1.看看数据库里的表结构怎么写 CREATE TABLE Images (     PicN ...