如何修复在Edge上运行良好但在IE上不起作用的CSS - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

Edge浏览器兼容性问题如何修复，这篇文章告诉你

前言现在使用Edge浏览器的人越来越多，我们在使用edge浏览器时也可能会遇到这样那样的问题，其中我们就有可能会遇到兼容性的问题，如下图：本文我们就来介绍一下，如何解决edge浏览器的兼容性问题。...方法1：更改Edge的兼容性视图设置如果问题是由于网站不适应新版Edge的HTML/CSS/JavaScript标准导致的，可以通过以下步骤调整兼容性视图设置：打开Microsoft Edge浏览器，访问出现问题的网站...方法2：使用IE模式浏览对于仅兼容旧版IE的网站，Edge浏览器内置了IE模式。打开Edge浏览器设置，寻找与“IE模式”相关的设置选项，启用并配置需要使用IE模式的网站列表。...方法3：更新Edge浏览器确保Edge浏览器版本是最新的，因为许多兼容性问题会在后续版本中得到修复。可以通过设置菜单检查并更新浏览器。...总结解决过期程序与Edge浏览器的兼容性问题需要开发人员及时更新程序并使用最新的技术和工具。通过遵循本文提供的解决方案，我们可以确保我们的程序在Edge浏览器中顺利运行，提供更好的用户体验。

8481 0

前端翻译：Activating Browser Modes with Doctype

本文重点讲解模式选择的机制而不是各种模式对应的行为特征。目的是让大家理解如何避免陈旧的模式，当然也不是旨在促进大家采用更良好的模式了。...我没有在塞班自带的浏览器上测试过，也没有在Konqueror上作充分地测试，所以不敢保证其准确的行为模式。...模式的作用布局除了IE，text/html的模式主要影响CSS布局和样式系统。例如，table中没有样式继承是怪异模式的特性。...当你通过模拟器在个版本的IE上测试时，模式对脚本的影响会明显。 ...下面是简单的教程，告诉在已经通过doctype触发标准模式的情况下，如何选择X-UA-Compatible的HTTP头或meta元素了。 1.

9807 0

您找到你想要的搜索结果了吗？

是的

没有找到

CSS和网络性能

在这篇文章中，我想看看CSS如何证明是网络上的一个重大瓶颈（本身和其他资源）以及我们如何缓解它，从而缩短关键路径并缩短开始渲染的时间。...Firefox和IE / Edge：将@import放在HTML中的JS和CSS之前在Firefox和IE / Edge中，Preload Scanner似乎没有使用或...由于无效预装载扫描程序导致Firefox失去并行化（N.B.在IE / Edge中出现相同的瀑布。）...IE / Edge中出现相同的瀑布。）...虽然这在理论上都是正确的，但在实践中事情总是有所不同。套用中国的一句老话，实践出真知啊。

1.3K3 0

IE 浏览器已“死”，一个时代的终结

IE 的增量改进无法与整个 Web 的普遍改进相匹配，因此微软重新开始——推出 Microsoft Edge。事实上，IE 浏览器也会继续以“IE 模式”存在于 Edge 浏览器。...但在 20 年前，IE 可是风靡全球的王者浏览器，1995 年，微软发布 Windows 95 操作系统，这也是微软史上最成功的操作系统之一。...2 Chrome、Firefox 异军突起，IE 辉煌不再在 IE 疲劳于修复 bug 无暇专注改善用户体验与功能更新的同时，Firefox 和 Chrome 慢慢展开了与 IE 的竞争。...用户仍会在自己的设备上看到 IE 浏览器的图标（例如在任务栏上或开始菜单中），但如果他们点击打开 IE 浏览器，Edge 浏览器就会被打开并进入 IE 模式。...无论如何，IE 浏览器始终是许多人的第一个浏览器，尽管它往往也是最差的那个。就连微软 Edge 浏览器官方微博都忍不住调侃，“如今比起 IE 本身，更火的可能是黑 IE 的 meme（梗图）”。

5061 0

常见的几种 CSS 水平垂直居中解决办法

，后者必须设置在子元素上，因此我们要为需要定位的文本再增加一个元素： css"> html,body,div {margin: 0;padding:...图片的居中也同理。 ? ? 四、IE6下的解决方案 IE6这么霸道..不过还是可以以bug攻bug 在Internet Explorer 6及以下版本中，在高度的计算上存在着缺陷的。...六、css3中transform的使用其实这种方式给负边距差不多，原理也是拉回来，不过因为css3的关系，IE8以下（包括IE8）还不支持使用 transform: translate(-50%,-...3.在Windows Phone设备上不起作用。浏览器兼容性： Chrome,Firefox, Safari, Mobile Safari, IE8-10....绝对定位方法在最新版的Chrome,Firefox, Safari, Mobile Safari, IE8-10.上均测试通过。

1.2K1 0

【Bootstrap】009-全局样式：辅助类

这些类可以应用于链接，并且在鼠标经过时颜色可以还可以加深，就像默认的链接一样； 2、演示代码演示：在某些情况下，一个充分的解决办法是将元素的内容包装在中并与class一起使用； 4、向辅助技术传递意义与上下文的颜色一样，确保通过颜色传达的任何意义也是以一种非纯粹表象的格式传达的；...注意，这些类只对块级元素起作用，另外，还可以作为 mixin 使用； .hide 类仍然可用，但是它不能对屏幕阅读器起作用，并且从 v3.0.1 版本开始就不建议使用了。...sr-only 和 .sr-only-focusable 联合使用的话可以在元素有焦点的时候再次显示出来（例如，使用键盘导航的用户）。对于遵循可访问性的最佳实践很有必要。.../css/bootstrap.min.css" /> .sr-only 类除了屏幕阅读器外，其他设备上都隐藏元素: <a class="sr-only

691 0

为什么我对JavaScript的未来持乐观态度？

的死亡：现在，IE 11 已正式退役，Web 开发人员可以编写更少的特定于供应商的 CSS，从而使样式表更小，hack 更少。...但这是目前最好的，我很乐观。由于不需要花一周的时间去研究深奥的IE错误，数千（或数百万）的开发者时间将被累计节省。下面是一个例子，说明这种排列组合如何使所有的 web 开发者受益。...想象一下，你是一个框架的作者，试图编写一个可重复使用的图像组件，以帮助成千上万的开发人员在使用图像时获得良好的性能。在2020年，就在几年前，你需要围绕 web 平台开展工作。...在客户端和服务器上都可以运行的同构 JavaScript（即可以在客户端和服务器上运行的代码）一直是许多 Web 开发人员的理想状态。...JavaScript: 在 Edge 中 Edge computing，这种常常被误解的最新运行 JavaScript 的目标，在三个（浏览器、服务器、edge）中标准化最少。

9123 0

Wave-Share -无服务器，点对点，通过声音共享本地文件

正文字数：1807 阅读时长：3分钟这是一个有关于使用声音的WebRTC信号的概念验证。适用于所有有麦克风+扬声器的设备。在浏览器中运行。...运行compile.sh 脚本。 CLI工具 wave-share 这是一个简单的工具，使用 wave-share共享tx/rx协议接收和发送数据。在标准输入上键入一些文本，然后按Enter键发送。.../wave-share 下面是一个演示如何使用CLI工具的短片：https://youtu.be/TcfjCMCyqF0 已知的问题/需要改进的东西不适用于:IE、IE Edge、iOS上的Chrome.../Firefox、macOS上的Safari 超声波传输在大多数设备上不起作用。...需要用纯JS重写在移动设备上，使用Firefox，即使在关闭选项卡后，页面仍可以在后台运行

1.8K2 0

IE之页面加载慢.

然后把base64编码写在dom里的实现方式改成了css加载src. 改完之后, 后台已经完全不涉及到读写图片卡顿问题了....IE与Gzip 如果不是图片导致的加载慢, 为什么很多小伙伴反馈大屏慢呢? IE以及Edge似乎更卡一点. 我们用Chrome访问一张大屏模板, 对比下IE访问模板的响应时间....op=fs_main&cmd=entry_report&id=2571 截图一看清楚了, IE里看上去Gzip就没起作用, 实实在在的加载原js. 用了4s才加载完....("edge"); 8 } 实际上高版本IE早就支持Gzip了, 因为IE11里http的响应头已经写了Accept-Encoding: gzip, deflate....找了早期的IE9看了下, 也是支持Gzip压缩的. 修复验证因为是线上环境, 我们本地没还原客户那边的卡顿很久空白的情况, 猜测跟网速有关系. 需要用一个软件来模拟低速网络环境,.

2.4K7 0

GitHub 和 Twitter 都在用的 CSS 库

简介不同浏览器对于同一个元素会有不一样的默认样式，normalize.css 采用和平且高效的方式，解决了浏览器默认样式的问题，尽可能让同一个 CSS 文件在不同的浏览器上显示一样的效果。...主要作用：与许多 CSS reset 不同，保留有用的默认值，而非删除它们。标准化各种元素的样式。纠正错误和常见的浏览器不一致问题。通过细微的修改提高可用性。使用详细注释解释代码的作用。...Chrome Edge Firefox ESR+ IE 10+ Safari 8+ Opera 项目地址是： github.com/necolas/nor… 下载安装 npm npm install -.../latest/normalize.css 简单使用 normalize.css 修复了 CSS reset 范围之外的常见桌面和移动浏览器错误。...包括 HTML5 元素的显示设置、更正 font-size 预格式文本、IE9 中的 SVG 溢出以及跨浏览器和操作系统的许多与表单相关的错误。

641 0

Angularjs SPA开发的一些经验分享

是属于经典MVC模式，但在1.0把scope独立注入过后，更倾向于MVVM模式，这将会后续随笔中写道）简化前端开发和使得前端业务逻辑得以分离，view和表现逻辑的分离，更便于维护，扩展。...3：注意一些特殊的节点式的angularjs directive，因为在IE7上这是不被认识的，因为IE的严格XML模式。...这会导致逻辑的混杂耦合，对于angularjs自身的绑定对html操作，很多时候你会分不清是view的影响源，导致修复bug，和新增功能，重构的艰难，常常出现很多的诡异行为。...最好的实践模式则是把必须的dom，css操作移向angular的Directive，或者view中。在angularjs模式中只有directive和view才能出现dom和css的逻辑操作。 ...14：angularjs的的模块管理参见如何组织大型JavaScript应用中的代码？.

1.3K1 0

angular浏览器兼容性问题解决方案

问题：edge浏览器下，固定列的边框消失原因：ng-zorro-antd表格组件使用nzLeft和nzRight指令固定的表格列，这两个指令的实现css3中的标签： position: -webkit-sticky...important; 谷歌、火狐及-webkit-内核的浏览器均支持该属性（css3），IE不支持该属性，所以在IE中，会自动降级，表格无固定列，可滑动的形式。...Edge浏览器在1703之后的版本使用了chromium内核，对css3的属性支持较好，也支持sticky属性，可以使用，可以固定表格列，但边框会消失。...比如在placeholder改变时，placeholder的文字不是英语的时候就会触发，Edge15+修复了这个问题，但是IE可能永远都不会修复这个问题。...，插件需要自己添加到项目文件中（根据angular团队所说，这个插件修复了一个IE10或者IE11的bug，但是提交了太多的代码，这会给增加现有的应用的打包体积，虽然后面关于这个PR讨论了挺久，但是看样子是准备把这个放到

3.1K3 0

【Bootstrap】004-全局样式：代码

一、内联代码 1、说明通过标签包裹内联样式的代码片段； 2、演示代码演示：运行结果：二、用户输入 1、说明通过标签标记用户通过键盘输入的内容； 2、演示代码演示：的展示代码，注意将尖括号做转义处理；还可以使用 .pre-scrollable 类，其作用是设置 max-height 为 350px ，并在垂直方向展示滚动条； 2、演示代码演示：运行结果：五、程序输出 1、说明通过标签来标记程序输出的内容； 2、演示代码演示：运行结果：

671 0

当代 Web 的 JSON 劫持技巧

这个问题在 FireFox 浏览器中似乎被修复了，但是我发现了一种对 Edge 进行攻击的新方式。虽然 Edge 好像是阻止分配 window....或许它在进行一些字符编码的扫描，亦或是截断相应和 NULL 后面的字符在 Edge 上不是一个有效的 JS 变量。我不确定，但是在我的测试中，似乎需要一个 NULL 与其他一些填充字符。...IE 上，当检查 isNaN 时 window.external 将会抛出一个异常。...CSS 你可能认为这种技术可以应用于 CSS，在理论上是可以的，因为任何 HTML 将被转换为非 ASCII 的无效 CSS 选择器。...Edge，Firefox 和 IE 在标准模式下似乎也会检查 mime 类型，Chrome 说样式表被解析了，但至少在我的测试中并不会这样。

2.4K6 0

IE支持而Firefox不支持的CSS属性

今天，居然发现了一个IE支持，而Firefox确不支持的CSS属性。....peopleBox a { text-indent:-999px; } 测试的时候，发现IE下表现良好，但是Firefox确无动于衷。...一直以来，从小到大，思想里从来不会出现这样的情形，所以当时确实是大吃一惊。...The box is indented with respect to the left (or right, for right-to-left layout) edge of the line box...原来只对块级元素起作用，而且只是第一行。看来这些东西记得还是不是很牢固参考资料： 1、W3C

8922 0

Bootstrap 响应式框架第二集

：指定用哪个IE的内核来进行页面的渲染 2、IE=edge 指定渲染页面的IE浏览器的内核 IE=6 : 指定使用...IE6的内核来渲染页面在高于IE6(包含)的浏览器中，统一都使用IE6内核渲染在低于IE6的浏览器中，使用当前浏览器中最高版本的内核进行渲染...IE=11 IE=edge 4、引入 bootstrap.css css/bootstrap.css..."> 5、引入两个兼容性 JS 文件作用：让老版本的IE(IE8及以下) 支持 H5的新标记以及 C3 媒体查询技术 1、html5shiv.min.js...class 1、定宽容器在不同宽度大小的设备上均提供了固定的宽度值类：.containe lg :

2.6K3 0

WordPress主题开发基础：Body 类指南

您是一位有抱负的WordPress主题设计师吗，正在寻找在主题中使用CSS的新方法？幸运的是，WordPress会自动添加您可以在主题中使用的CSS类。...在向您展示特定用例场景之前，我们将向您展示如何使用过滤器添加body类，以便每个人都可以在同一页面上。...在文章编辑屏幕上，您会在右侧列中找到一个名为“文章类（Post Classes）”的新元框。...在文章编辑屏幕上，您会在右侧列中找到一个名为“文章类（Post Classes）”的新元框。单击以添加您的自定义CSS类。您可以添加多个由空格分隔的类。完成后，您只需保存或发布您的文章即可。...现在，该插件会将您的自定义CSS类添加到该特定文章或页面的body类。在Body类上使用条件标签当body_class函数与条件标签一起使用时，它才真正发挥作用。

2.1K2 0

27 年 IE 终落幕，再见 IE，你好 Edge

但在 20 年前，IE 可是风靡全球的王者浏览器，1995 年，微软发布 Windows 95 操作系统，这也是微软史上最成功的操作系统之一。...IE 逐渐衰落就在 IE 如日中天的时候，衰落已初见端倪。2001 年，微软发布 Windows XP 操作系统，不夸张的说这应该是世界上最流行的操作系统。...由于 IE6 存在较多问题，微软陆陆续续推出了多次修复升级补丁，但是直到五六年之后，微软才推出了新的 IE7，不过移动互联网的兴起加上竞争对手的步步蚕食，此时的浏览器市场已经不再是 IE 一家独大了。...3 Chrome、Firefox 异军突起，IE 辉煌不再在 IE 疲劳于修复 bug 无暇专注改善用户体验与功能更新的同时，Firefox 和 Chrome 慢慢展开了与 IE 的竞争。...4 新 Edge 获好评，但路还很长在 IE 不堪大用的同时，微软决定使用 Edge 取代 IE，但最初使用 EdgeHTML 的 Edge 体验并不算优秀，在 Chromium 内核占主导的浏览器市场

5393 0

rem适配布局

rem 作用于非根元素字体大小时，相对于根元素字体大小；rem 作用于根元素字体大小时，相对于其初始字体的大小。...and：相当于”且”的意思，即当媒体类型和媒体特性都符合条件才起作用； not：相当于”非”的意思，排除某个媒体类型，可以省略 only：指定某个特定的媒体类型，可以省略媒体特性每个媒体类型都具有不同的特性...> 2 less CSS 弊端 CSS 是非程序是语言，没有变量、函数、作用域等概念。...需要大量看似没有逻辑的代码，CSS 冗余度较高不方便维护及扩展，不利于复用没有良好的计算能力介绍 Less（Leaner Style Sheets 的缩写）是一门 CSS 扩展语言，成为 CSS...常见的 CSS 预处理器： Sass、Less、Stylus Less 作为 CSS 一种形式上的扩展，没有减少 CSS 的功能，而是在现有的 CSS 语法上，加入程序式语言的特性。

1.4K3 0

一行代码解决各种IE兼容问题,IE6,IE7,IE8,IE9,IE10

IE=8″ /> 二.设定网站服务器以指定预设兼容性模式如果服务器是自己的话，可以在服务器上定义一个自订标头来为它们的网站预设一个特定的文件兼容性模式。...，支持更多的W3C标准，支持CSS2、CSS3选择器。...它修复了许多的HTML和CSS问题，并使得透明PNG在IE5、IE6下正确显示。使IE5,IE6兼容到IE7模式（推荐）作用,默认会占满整个容器。...这个插件可以让用户的IE浏览器外不变，但用户在浏览网页时，实际上使用的是Google Chrome浏览器内核，而且支持IE6、7、8等多个版本的IE浏览器。

4K2 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭