IE版本兼容性问题_html/css_WEB-ITnose

我机器上安装的是IE10,文件选择框是这个样子的

可是我用IETester测试各个IE版本,从IE6到IE8都是显示以下效果

根本就无法选择文件,html代码是

  导入Excel 

登录后复制

还有一个问题
在IETester中,IE6和IE7的效果是这样的

IE8以上正常,应该是

html代码是

登录后复制

CSS样式代码为

.well {  min-height: 20px;  padding: 19px;  margin-bottom: 20px;  background-color: #f5f5f5;  border: 1px solid #e3e3e3;  -webkit-border-radius: 4px;     -moz-border-radius: 4px;          border-radius: 4px;  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);     -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);}.summary {display:table; width:100%; padding:0; margin:0 0 20px 0;}.summary ul {margin:0; padding:0; overflow:hidden; display:table-row;}.summary li {margin:0; padding:19px; display:table-cell; border-right:1px solid #eee;}.summary li:last-child {border:none;}.summary a {display:block; font-size:1.2em; line-height:1.4em; text-transform:uppercase; color:#000;}.summary .count {display:block; font-size:1.75em; font-weight:bold;}/* dashboard - ie fixes */.ie7 .summary {display:block;}.ie7 .summary ul {margin:0; padding:0; overflow:hidden; display:block;}.ie7 .summary li {float:left;}.ielt9 .summary .last {border:none;}

登录后复制

回复讨论(解决方案)

查出第二个原因是display:table-cell 不支持IE6,IE7
可是应该怎么修改CSS代码呢?求助啊

第一个问题,尝试去掉runat='”server”,看看效果。或者通过size或者css的width设置一下宽度。
第二个问题,你已经使用了float:left,可以设置li的宽度,保证所有li的总宽度(考虑border,margin等因素)小于外框的宽度,这样就可以在一行了。

第二个问题,如果你需要动态自动设置宽度和高度,可以下载 display-table.htc这个htc文件,再按照页面的介绍引用文件和设置css。

第一个我改用jQuery的uploadify解决了
第二个 后来发现css中有一段代码
 /* dashboard – ie fixes */
.ie7 .summary {display:block;}
    .ie7 .summary ul {margin:0; padding:0; overflow:hidden; display:block;}
    .ie7 .summary li {float:left;}
     
    .ielt9 .summary .last {border:none;}
在外层加个div,设置class为ie7,结果ie6,ie7都正常了

还是谢谢你的建议

国外好些网页模板在html节点添加class=”ie7″这种的方式,这样就不用在现有的框架下再添加额外的层了。

第一个我改用jQuery的uploadify解决了
第二个 后来发现css中有一段代码
 /* dashboard – ie fixes */
.ie7 .summary {display:block;}
    .ie7 .summary ul {margin:0; padding:0; overflow:hidden; display:block;}
    .ie7 .summary li {float:left;}
     
    .ielt9 .summary .last {border:none;}
在外层加个div,设置class为ie7,结果ie6,ie7都正常了

还是谢谢你的建议

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/3092245.html

(0)
上一篇 2025年3月28日 13:51:28
下一篇 2025年3月28日 13:51:35

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • HTML5—新语义元素使用及兼容

    1.新语义元素: HTML5提供了新的语义元素来明确一个Web页面的不同部分。 :描述了文档的头部区域,于定义内容的介绍展示区域 :定义导航链接的部分。 :定义文档中的节(section、区段)。比如章节、页眉、页脚或文档中的其他部分,se…

    2025年4月1日
    100
  • 教你如何增强H5中video标签在浏览器中的兼容性

    使用html5时就应该考虑包括桌面以及移动端的浏览器兼容问题,特别是视频方面浏览器对解码的支持会有所不同,所以下面就来分享一个html5的video标签的浏览器兼容性增强方案分享,需要的朋友可以参考下 在过去 flash 是网页上最好的解决…

    编程技术 2025年4月1日
    100
  • css中使用rgba()遇到的问题及解决办法

    今天遇到了一个问题,要在一个页面中设置一个半透明的白色div。这个貌似不是难题,只需要给这个div设置如下的属性即可: background: rgba(255,255,255,.1); 登录后复制 但是要兼容到ie8。这个就有点蛋疼了。因…

    2025年4月1日
    200
  • 怎样解决各种ie6-ie10的兼容问题

    这次给大家带来怎样解决各种ie6-ie10的兼容问题,解决ie6-ie10的兼容问题的注意事项有哪些,下面就是实战案例,一起来看一下。 x-ua-compatible 用来指定注意事项解析编译页面的注意事项 x-ua-compatible …

    编程技术 2025年4月1日
    100
  • AngularJS重要版本更新

    目前团队正在开发 angularjs 1.7.0,而 1.7 的开发周期将一直持续到 2018 年 6 月 30 日   Angular 团队的早期开成员之一Pete Bacon Darwin 近日在 Angular 博客 公布 了一个消息…

    2025年3月31日
    200
  • Linux系统怎么查看版本信息?

    1、输入”uname -a “,可显示电脑以及操作系统的相关信息。 $ uname -aLinux hadoop02.zjl.com 2.6.32-696.el6.x86_64 #1 SMP Tue Mar 21 1…

    编程技术 2025年3月31日
    100
  • 当前比较流行的Linux版本

    linux长时间以来都是极客圈子内的玩物,大众对其知之甚少,但谁都无法否认其重要性。近年来,linux开始获得越来越多的关注,那你知道国内外流行的linux版本都有哪些吗?一起来看看网友整理的这些linux版本吧。 1. RedHat 国内…

    编程技术 2025年3月30日
    100
  • 几个解决兼容IE678不支持html5标签的几个方法_html5教程技巧

    html5大行其道的时代已经到来。如果你还在等待浏览器兼容,说明你已经与web脱节几条街了。当然,这得益于移动客户端的蓬勃发展。如果还在纠结于,是否应该掌握html5和css3技术时,请狠狠的抽自己几个嘴巴,然后,苦学吧!因为前端的春天已经…

    编程技术 2025年3月29日
    200
  • HTML5 声明兼容IE的写法_html5教程技巧

    是HTML5的声明,主流的游览器中只有IE8及以下版本不支持,这样IE会进入Quirks模式。但之后的声明可以强制指定IE的呈现模式,所以声明对IE就无影响。 HTML5并没有XHTML那么严格,对于一般的xhtml页面,基本都不通完全通过…

    编程技术 2025年3月29日
    100
  • 怎么看word是什么版本

    php小编子墨教你如何快速判断word文档的版本。打开word文档后,点击文件菜单,选择“帮助”,再点击“关于word”,在弹出的对话框中可以看到word的具体版本信息。通过这种简单的方式,你可以轻松了解word文档的版本,方便进行后续的操…

    2025年3月29日 互联网
    100

发表回复

登录后才能评论