【Web】前端框架对微软老旧浏览器的支持

news2025/1/11 0:07:17

零、原因

最近要做一个项目,要能在学校机房运行的,也要在手机上运行。电脑和手机,一次性开发,那最好的就是响应式前端框架了。手机和正常的电脑兼容性问题应该都不大,但是学校机房都是Win7的系统,自带的都是IE8的浏览器。虽然有安装谷歌浏览器、360浏览器啥的,但是默认的还是IE浏览器。这就有一个问题,就是在你用极域电子教师发送指令让学生机打开某个网页时,用的就是IE,当然可以告诉学生复制地址到谷歌浏览器里打开,但是就还是有很多学生不懂怎么复制,怎么打开。索性让项目兼容IE得了,故此对前端响应式框架技术(Bootstrap、Layui)进行了一定的探索,也是对之后项目技术选型的一次简单调查吧(之前新建项目都要选好久用啥框架QWQ)。

壹、Edge

先使用2023年的Edge给出目标效果,顺便讲讲官方文档中对浏览器兼容性的介绍。
前端框架主要分成排版(样式)和插件(可能需要JavaScript支持的某些组件)两部分,本次选取前端框架的某些具体示例看支持的程度如何(简单测试,测试得不全面)。

  1. Layui 2.7.6
    官方文档中明确不支持IE6 / IE7。
    插件
    Layui排版
    Layui
  2. Bootstrap 2.3.2
    官方文档上只说支持的浏览器中包括IE7。
    排版Bootstrap2插件Bootstrap2排版Bootstrap2
  3. Bootstrap 3.4.1
    Bootstrap3 介绍是支持IE8 - IE11的。
    排版
    Bootstrap3排版和插件Bootstrap3插件Bootstrap3

贰、IE6(Windows XP 自带)

IE6,中文名:网络探路者6,2001年8月27日IE6发布,同年10月25日WinXP发布,集成IE6。2008年4月28日为Windows XP发布最后的SP3,集成IE6 SP3(版本号6.0.2900.5512),次年发布IE8。IE6包括增强的DHTML,以及对CSS 1、DOM 1和SMIL 2.0等的部分支持,MSXML也提升到了3.0版本。由于IE6的种种新特性,并且网页开发技术也大大提高。当时的网页开始多样化、丰富化。

  1. Layui 2.7.6
    Layui IE6Layui IE6
    部分常规排版可用,一些高级组件用不了。

  2. Bootstrap 2.3.2Bootstrap2 IE6bootstrap中文网访问不了,可能是IE6对https支持不太好,后面再刷新就是空白的了,因此使用的自己写的一些bootstrap2网页。Bootstrap2 IE6
    Bootstrap2 IE6一些组件用不了。
    Bootstrap2 IE6某些排版也用不了,上面的导航栏还是我修改后的。

  3. Bootstrap 3.4.1Bootstrap3 IE6排版是乱的,导航栏没有修改。Bootstrap3 IE6部分排版可用。Bootstrap3 IE6插件算部分能用的状态吧。

总结就是要兼容IE6,难!很多框架都不对IE6支持了。

叁、IE8(Windows 7 自带)

IE8支持或加强很多当时网页新技术(如对PNG Alpha支持的改进使在显示PNG图片时CPU不会飙升到100%,完全通过Acid2测试)。IE8还是微软第一个公开Trident引擎版本的IE,使用Trident 4.0内核。IE8在HTML5、CSS 3等技术方面仍落后于其他浏览器对手(诸如Acid3最初只有20分,即使Acid3改进了算法后也只有23分,HTML5测试虽然比IE7高,但也只得43分)。IE8是支持Windows XP最后的IE。

  1. Layui 2.7.6
    Layui IE8Layui IE8基本没啥问题,插件和排版都能用。

  2. Bootstrap 2.3.2Bootstrap2 IE8Bootstrap2 IE8Bootstrap2 IE8
    插件部分可用,排版部分混乱。

  3. Bootstrap 3.4.1
    Bootstrap3 IE8
    Bootstrap3 IE8
    Bootstrap3 IE8
    基本没啥问题,插件和排版都能用。反而Bootstrap3比Bootstrap2要支持得更好些,哈哈。

总结:能用

肆、IE11(Windows 8.1 自带)

IE11扩大对HTML5和CSS3的支持,且添加的这些新特性多数均是非常新潮的特性(如HTML5拖放,HTML5全屏,CSS边框图,视频码率控制,视频字幕隐藏,媒体加密,WebGL等等),使得IE11在显示HTML5网页时基本不出现到处不支持的问题。IE11在功能上新增对Google的SPDY协议的支持,对Chakra进行了更多优化,硬件加速渲染相比IE9和IE10更快,在同样多加载项的情况下,IE11网页加载速度已超过WebKit和Blink内核浏览器,支持在后台智能预判并迅速在内存中取出已经看过的网页而不需要重新连接网站加载。使用全新的UA(用户代理识别字符串)绕开网站用来判断旧版IE的CSS Hack,而使IE在浏览旧版网站时返回与FireFox相同的页面。全新的F12开发人员工具以新颖的界面和非常直观的图形化指示帮助开发人员迅速对网站运行情况进行监控并及时优化,尤其是"仿真"功能类似过去的"兼容性视图",但功能更强大,可以在PC中显示与Windows Phone或XBox相同的页面,更改页面显示方向和分辨率,还可以模拟GPS定位以测试网站跟踪位置功能是否正常。

  1. Layui 2.7.6Layui IE11Layui IE11支持得很好的样子,插件和排版都没问题。

  2. Bootstrap 2.3.2Bootstrap2 IE11Bootstrap2 IE11Bootstrap2 IE11没多大问题,都还算正常。

  3. Bootstrap 3.4.1Bootstrap3 IE11
    Bootstrap3 IE11
    导航栏排版有点小问题,这个我在开发的时候也做了挺久的,开发的时候用的Edge。Bootstrap3 IE11
    小问题,或许开发的时候应该针对性地调整一下(真麻烦)。

总结:还好

伍、总结

Bootstrap3 和 Layui2 还是在维护中的,最老支持到 IE8,WinXP 能装 IE8(那直接装谷歌更好了),Bootstrap2 最老支持到 IE7,但是实际用的时候还是得针对性调整。本次测的前端框架都不支持 IE6 了,排版勉强能用用吧。如果不是必须的需求,建议升级浏览器,放弃使用IE(除非它起死回生)。

陆、参考资料

IE浏览器

  • https://baike.baidu.com/item/Internet Explorer/1537769

Bootstrap

  • https://v3.bootcss.com/getting-started/
  • https://v3.bootcss.com/migration/
  • https://v2.bootcss.com/index.html

Layui

  • http://layui.org.cn/demo/layedit.html
  • http://layui.org.cn/doc/index.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/482720.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【Linux内核解析-linux-5.14.10-内核源码注释】MM内存管理内核启动初始化源码解析

源码 这是Linux内核中的mm_init函数的代码,其作用是初始化内存管理相关的组件和数据结构。 static: 这是一个函数声明修饰符,表示该函数只在当前文件中可见。 void __init: 这是函数的返回类型和修饰符,表示该函数是内核初始化代码。 page…

SpringCloud详解

SpringCloud是一个基于SpringBoot的分布式系统开发框架,它能够帮助我们快速、稳定地构建分布式系统。本篇博客将对SpringCloud进行详细解析,介绍SpringCloud的主要组件和相关应用场景,同时提供代码示例以帮助读者更好地掌握SpringCloud的实际…

nodejs+vue学生考勤请假管理系统java python php

用户登录模块:用来区分二种用户,学生、管理员。 个人信息管理:用户登录后可以修改用户表中的个人信息。 主页模块:在信息表中读取信息并按照一定模板显示在首页。 信息搜索模块:将信息表中所有信息的标题或内容关键字与…

析构函数/拷贝构造/赋值重载

析构函数: // 析构函数~Stack(){_top 0;_capacity 0;free(_a);_a nullptr;} 1 、2两点与构造函数类似。 3、当我们未显示定义时,编译器会自动生成默认的析构函数。C中,对于内置类型不进行任何处理,对于自定义类型&#xff0…

【SAS应用统计分析】方差分析

声明:本文知识参考内容来自网络,如有侵权请联系删除。 目录 【anova过程】 1.anova过程的语句格式 2.语句说明 【glm过程】 1.glm过程的语句格式 2.语句说明 【实例分析】 【实验步骤】 总结 【anova过程】 SAS系统的START软件提供了anova过程…

TensorRT:自定义插件学习与实践 001

文章简述 本文简单列出了编写Tensorrt插件所需要的关键方法,分为两个部分,一是插件类的具体实现方法,另外是插件工厂的调用方法,插件类最终将编译为.so文件,使用时在c或python中调用,所以插件类的方法调用在其他部分,在本文中难以直观的体现调…

PyQt5

最近在学习pyqt5, 使用pyqt5的时候出现了一些莫名奇妙的问题,解决之后决定把它记录下来,方面pyqt5的初学者使用。 每个问题会按照如下方式进行描述 1、问题描述: 2、解决方法: 问题1: 使用pyinstaller打…

计算机网络笔记:TCP三次握手和四次挥手过程

TCP是面向连接的协议,连接的建立和释放是每一次面向连接的通信中必不可少的过程。TCP连接的管理就是使连接的建立和释放都能正常地进行。 三次握手 TCP连接的建立—三次握手建立TCP连接 ① 若主机A中运行了一个客户进程,当它需要主机B的服务时&#xff0…

迁移学习

迁移学习 什么是迁移学习 迁移学习【斯坦福21秋季:实用机器学习中文版】 迁移学习(Transfer Learning)是一种机器学习方法,它通过将一个领域中的知识和经验迁移到另一个相关领域中,来加速和改进新领域的学习和解决问…

OS开源项目周报0105

由OpenDigg 出品的iOS开源项目周报第四期来啦。iOS开源周报集合了OpenDigg一周来新收录的优质的iOS开发方面的开源项目,方便iOS开发人员便捷的找到自己需要的项目工具等。 Hero 酷炫的iOS动画引擎 Traits 实时修改原生iOS 应用属性 JSDBanTangHomeDemo 仿半糖首页…

【Git】‘git‘ 不是内部或外部命令,也不是可运行的程序

一、问题 我想利用git clone命令从github上下载项目源代码,发现报错: git 不是内部或外部命令,也不是可运行的程序或批处理文件。我用cmd跑一下git命令,发现报错: 二、问题分析 这个错误提示表明您的系统中没有安装…

Illustrator如何使用基础功能?

文章目录 0.引言1.菜单栏2.工具箱 0.引言 因科研等多场景需要进行绘图处理,笔者对Illustrator进行了学习,本文通过《Illustrator CC2018基础与实战》及其配套素材结合网上相关资料进行学习笔记总结,本文对软件界面基本功能进行阐述。    1…

第四章 数据关联分析方法

基本概念和方法 关联规则和算法应用 基本概念和术语 关联规则算法应用: 一个关联规则分析的例子—————超市购物篮分析 不要看 后面数字看不懂 项集:是指项的集合。包含k个项的项集称为k-项集 支持度:若A是一个项集,则A的…

Vue3 +TypeScript 引入 BabylonJs(Vue3实现3D)【一篇文章精通系列】

本文主要介绍如何使用Vue3和TypeScript引入BabylonJs技术实现3D效果。结合实际案例,详细讲解了如何在Vue3项目中引入BabylonJs,并了解其相关知识。通过本文的学习,相信读者可以轻松掌握Vue3实现3D效果以及BabylonJs的相关知识。 Vue3 TypeS…

天梯赛L1-001 ~ 010

👂 White Lie - Jhameel - 单曲 - 网易云音乐 👂 丁丁猫儿 - 施鑫文月 - 单曲 - 网易云音乐 今年蓝桥 / 天梯都陪跑,希望明年,蓝桥杯省一(CA组60分),天梯赛国三(180分)…

详细的实用技巧,让你轻松成为WEB自动化测试大师

目录 一、什么是WEB自动化测试 二、WEB自动化测试工具 三、SeleniumPython环境搭建 1. 安装Python解释器 2. 安装Selenium库 3. 下载浏览器驱动程序 4. 配置环境变量 四、WEB自动化测试实战 1. 编写测试脚本 2. 使用Page Object模式 3. 使用数据驱动测试 五、总结 …

【PowerDesigner】一款超好用的E-R图工具,快速构建出高质量的数据库结构,提高开发效率和代码质量

博主简介:努力学习的大一在校计算机专业学生,热爱学习和创作。目前在学习和分享:数据结构、Go,Java等相关知识。博主主页: 是瑶瑶子啦所属专栏: Mysql从入门到精通 近期目标:写好专栏的每一篇文章 文章目录…

IPsec IKE第一阶段主模式和野蛮模式

国密标准GMT 0022-2014 IPSec VPN 技术规范,IPsec IKE过程中交换类型的定义将主模式Main mode分配值为2,快速模式-quick mode分配值为32。标准中并没有提现分配值为4的交换类型。在实际应用中,IKE第一阶段经常会出现交换类型为4的情况&#x…

留守儿童爱心网站

摘要 随着留守儿童爱心管理的不断发展,留守儿童爱心网站在现实生活中的使用和普及,留守儿童爱心管理成为近年内出现的一个热门话题,并且能够成为大众广为认可和接受的行为和选择。设计留守儿童爱心网站的目的就是借助计算机让复杂的管理操作…

【C++】-关于类和对象的默认成员函数(中)-拷贝构造函数和赋值运算符重载函数

💖作者:小树苗渴望变成参天大树 ❤️‍🩹作者宣言:认真写好每一篇博客 💨作者gitee:gitee 💞作者专栏:C语言,数据结构初阶,Linux,C 如 果 你 喜 欢 作 者 的 文 章 ,就 给 作 者 点…