bootstrap响应式在IE8下未能自适应 窗口大小

LGSE 发布于 2013/08/21 12:50
阅读 5K+
收藏 0

添加完bootstrap-responsive.min.css文件后,在IE8下不是响应式布局,但是在搜狗浏览器和firefox下均可实现响应式布局,当缩写窗口时,布局会变化。

加载中
0
jacky-zhuo
jacky-zhuo

因为IE9以下不支持CSS3...

解决方案

http://www.bootcss.com/p/bsie/

0
xue777hua
xue777hua
你用的是 bootstrap 3.0?
LGSE
LGSE
回复 @xue777hua : 代码就是下面那里,非常感谢你的热情帮助啊
xue777hua
xue777hua
回复 @LGSE : 代码贴上来?
LGSE
LGSE
@xue777hua 是啊,同样html文档,360极速下可以,firefox可以,搜狗可以
xue777hua
xue777hua
回复 @LGSE : 不至于啊,官网说是支持responsive的
LGSE
LGSE
用的是Bootstrap v2.3.2版本
0
LGSE
LGSE
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<meta name="viewport" content="width=device-width,inital-scale=1.0">
<title>无标题文档</title>
<link href="bootstrap.min.css" rel="stylesheet" >


<!--[if lte IE 6]>
<link href="bootstrap-ie6.min.css" rel="stylesheet" type="text/css">
<link href="ie.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="bootstrap-ie.js"></script>
<![endif]-->
<link  href="bootstrap-responsive.min.css" rel="stylesheet">
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>


<script type="text/javascript" src="bootstrap.min.js"></script>
<script type="text/javascript" src="respond.min.js"></script>


</head>


<body>
<!--container这个类让容器显示在中间,这是固定宽度布局,流动布局是container-fluid -->
<div class="container">
<!-- 响应式布局,添加responsive.css,可以使页面布局自适应设备的屏幕大小,但是现在IE无法实现该功能,可能是html5.js文件有错误。在firefox下可以使用-->
  <h1 class="page-header">响应式布局<small>使用bootstrap网格系统布局网页</small></h1>
  <!-- bootstrap使用网格布局系统,把页面分成12列,使用row,span_x表示所占网格大小,通过这个网格布局系统是我们能够做出复杂的页面布局-->
  <div class="row">
    <div class="span3">
      <h2 class="page-header">区块一</h2>
      <p>kja oajoa akoiolal al al jdoaj la jdolajjalaj laj aljaljlajlajlaj aljljaljllajldjlajlajla al aljda jld alj</p>
    </div>
    <div class="span5">
      <h2 class="page-header">区块二</h2>
      <p>kja oajoa akoiolal al al jdoaj la jdolajjalaj laj aljaljlajlajlaj aljljaljllajldjlajlajla al aljda jld alj</p>
    </div>
    <div class="span4">
      <h2 class="page-header">区块三</h2>
      <p>kja oajoa akoiolal al al jdoaj la jdolajjalaj laj aljaljlajlajlaj aljljaljllajldjlajlajla al aljda jld alj</p>
    </div>
  </div>
  <div class="row">
  <div class="span8">
  <h2 class="page-header">主要内容</h2>
  <p> 根据公司实际设备配置情况,PDI(Primary Data Input)计算机主要负责完成录入板坯数据和人工编制的轧制计划数据,并下发给过程计算机。还负责收集过程计算机-加热炉计算机(FCE)和轧线计算机(MILL)上传的生产实际数据,进行存档,供以后查询。</p>
  </div>
  <div class="span4">
  <h2 class="page-header">边栏</h2>
  <p> 首先由计划员根据板坯库现有的板坯,结合轧制规程要求,编制轧制计划,然后将编制的结果,通过操作终端,由管理人员输入到本系统中来。</p>
  </div>
  </div>
</div>
</body>
0
xue777hua
xue777hua

我刚测试过,IE8没问题啊。我把你的charset=GBK 改成了 UTF-8

以下是我用的三个css和js文件。

http://www.kuaipan.cn/file/id_13851514342745016.htm

http://www.kuaipan.cn/file/id_13851514342745017.htm

http://www.kuaipan.cn/file/id_13851514342745015.htm

xue777hua
xue777hua
回复 @LGSE : 说错了 是邮箱发你了
xue777hua
xue777hua
回复 @LGSE : Q发你了
LGSE
LGSE
打包发我邮箱,我测试一下是不是我的IE8有问题。842817794@qq.com.谢谢
LGSE
LGSE
我用的版本是2.3.2的,也是官网下的。也有可能是我的IE有问题,做浏览器的兼容性好麻烦啊
0
Knight_King
Knight_King
楼主,你的问题解决了没?我也遇到这样的问题了~在火狐、谷歌浏览器下均没有问题,但是在IE浏览器下,不能实现自适应,而且我看了下CSS文件,在IE下完全没有加载bootstrap-responsive-min.css这个文件,所以设置的@media不能起作用,怎么解决啊~
LGSE
LGSE
还是不行!!不知道怎么弄了这下
返回顶部
顶部