Meta标签轻松解决解决360浏览器显示不正常问题

最新推荐文章于 2023-02-21 13:01:39 发布
最新推荐文章于 2023-02-21 13:01:39 发布
阅读量5.2k 收藏 2
点赞数 1
文章标签： 360浏览器 标签 浏览器 不兼容极速模式
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hitwh_fengben/article/details/54428320
版权

近期在写一个小网站时遇到了一些小问题，除了360浏览器以外其他浏览器均显示正常，而360浏览器就是显示不正常。

花了很大功夫，最后发现原来是360的模式问题，不同模式下内核不一样。

默认打开是兼容模式，此时显示不正常，当设置为极速模式时，显示就正常了，设置方法如下图。


点击可以选择模式。



但是问题来了，怎么设置网页加载时，就为极速模式呢？

只用在head标签中加上一个meta标签即可。

<head>
    <meta name="renderer" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
</head>
第二句话也是必不可少的，加上这两句话之后，可以测试一下，用360浏览器打开时，便正常多了。


hitwh_ben
关注
360浏览器兼容模式代码
Menqq的博客
06-01 1065
在页面head加：<meta http-equiv="X-UA-Compatible" content="IE=11"> 告诉浏览器最少使用IE11的内核去解析 能解决IE7内核下的很多问题； 在head标签中添加一行代码： <html> <head> <meta name="renderer" content="ie-comp"> </head> <body> </body> </html> 可
内核控制Meta标签：让360浏览器默认使用极速模式打开网页
weixin_30488313的博客
05-14 509
使用wordpress的模板默认是不支持低版本IE的。 现在360浏览器的装机量又那么大，，独独只有ie浏览器的访客越来越少，， 为了让网站页面不那么臃肿，也懒的理IE了，同时兼顾更多的国内双核浏览器，在网页页头中添加了下面两行Meta控制标签。 1，网页头部加入 <meta name=”renderer” content=”webkit”> 360浏览器就会在读取到这个...
360浏览器 - 自定义切换内核 meta标签 总结
草巾冒小子的博客
10-15 2727
为了避免用户360浏览器查看网站出现不兼容导致页面显示错位等显示bug 往往需要通过代码自定义选用内核，这样避免不会切核的用户出现反感······ 代码设置，通过开发者来完成 ，比用户完成来的实在！ 内核控制标签meta &gt; 如您是网站的开发者，可以通过在页面 `&lt;head&gt;` 标签中添加代码，来指定网站的模式 若页面需默认用极速模式，增加标签：&lt;meta nam...
用Meta标签代码让360双核浏览器默认极速模式打开网站不是兼容模式(顺带解决很多兼容性问题)
一屁小肥羊的专栏
02-07 6799
浏览模式 极速模式、兼容模式及IE9高速模式是360浏览器显示网页时使用的三种模式： 表示极速模式 表示兼容模式 表示IE9/IE10模式（仅在安装了IE9或IE10后可用） 360极速浏览器会自动为您选择使用适合每个网站的浏览模式。所以，通常您不用了解几种内核的区别。 几种模式各有什么特点 极速模式下，网站打开速度快，但某些网站在极速模式下可能出现兼容性问题，显示不正常。 兼容模
html中权限name,meta标签name="renderer" 属性写法及用法
weixin_33181159的博客
06-09 1874
HTML代码中的标签name="renderer" 属性用于告诉浏览器默认以哪种浏览器内核浏览当前网站，浏览器就会在读取到这个属性后，会立马切换到对应的模式。用法格式：直接在和之间添加以下代码，并指定浏览器内核类型；content的取值主要有三种浏览器内核，分别是：webkit：使用的webkit内核，属于极速模式，常用于网站的高速浏览，网站打开速度快，但某些网站在极速模式下可能出现兼容性问题，显...
多核浏览器选择默认模式
roking99的专栏
04-22 993
在head标签中添加一行代码： content的取值为webkit,ie-comp,ie-stand之一，区分大小写，分别代表用webkit内核，IE兼容内核，IE标准内核。 若页面需默认用极速核，增加标签： 若页面需默认用ie兼容内核，增加标签：<meta name="renderer" content="ie-com
一句话解决傻傻的多核浏览器切换
09-24
针对上述问题，360浏览器提供了一个非常简洁有效的解决方案——通过在HTML文档头部添加特定的`<meta>`标签来控制浏览器的渲染模式。这种方式不仅可以简化开发流程，还能够显著提升用户体验。 1. **默认使用Webkit...
常见浏览器兼容性问题与解决方案
张媛的博客
11-19 250
常见浏览器兼容性问题与解决方案 　　所谓的浏览器兼容性问题，是指因为不同的浏览器对同一段代码有不同的解析，造成页面显示效果不统一的情况。在大多数情况下，我们的需求是，无论用户用什么浏览器来查看我们的网站或者登陆我们的系统，都应该是统一的显示效果。所以浏览器的兼容性问题是前端开发人员经常会碰到和必须要解决的问题。 　　在学习浏览器兼容性之前，我想把前端开发人员划分为两类： 　　第一类是精确按照...
HLS的入门总结
laker的博客
02-21 2299
HLS 全称是 HTTP Live Streaming， 是一个由 Apple 公司实现的基于 HTTP 的媒体流传输协议。通过将整条流切割成一个小的可以通过 HTTP 下载的媒体文件，然后提供一个配套的媒体列表文件，提供给客户端，让客户端顺序地拉取这些媒体文件播放, 来实现看上去是在播放一条流的效果。其基于 Media Source Extensions 开发，用于实现 HTTP Live Streaming 开源JavaScript类库。
python爬虫介绍及其应用
m0_69043821的博客
04-28 2537
网络爬虫是什么 网络爬虫又称网络蜘蛛、网络机器人，它是一种按照一定的规则自动浏览、检索网页信息的程序或者脚本。网络爬虫能够自动请求网页，并将所需要的数据抓取下来。通过对抓取的数据进行处理，从而提取出有价值的信息。 认识爬虫 我们所熟悉的一系列搜索引擎都是大型的网络爬虫，比如百度、搜狗、360浏览器、谷歌搜索等等。每个搜索引擎都拥有自己的爬虫程序，比如 360 浏览器的爬虫称作 360Spider，搜狗的爬虫叫做 Sogouspider。 ...
Qt开发经验总结
草上爬的博客
12-02 8300
增加了很多轮子，同时原有模块拆分的也更细致，估计为了方便拓展个管理。把一些过度封装的东西移除了（比如同样的功能有多个函数），保证了只有一个函数执行该功能。把一些Qt5中兼容Qt4的方法废弃了，必须用Qt5中对应的新的函数。跟随时代脚步，增加了不少新特性以满足日益增长的客户需求。对某些模块和类型及处理进行了革命性的重写，运行效率提高不少。有参数类型的变化，比如 long * 到 qintptr * 等，更加适应后续的拓展以及同时对32 64位不同系统的兼容。
ie浏览器中样式的问题以及解决方法
CheyBen的博客
01-06 953
IE兼容性：IE9包括IE9不支持flex布局，也不支持动画样式keyframes 1、通过meta代码强制浏览器使用WebKit内核极速模式（解决 meta name="renderer" content="webkit" 不起作用） 2、设置双核浏览器的浏览模式<meta name=“renderer” content=“webkit|ie-comp|ie-stand”> 3...
设置双核浏览器的浏览模式<meta name=“renderer” content=“webkit|ie-comp|ie-stand”>
weixin_30607659的博客
07-05 113
参考网址： http://blog.csdn.net/tototuzuoquan/article/details/18400789 http://camnpr.com/html-css/2087.html http://www.15yan.com/story/1H1vIDRzhWc/ http://blog.csdn.net/www3300300/article/details/...
meta name="renderer" content="webkit|ie-comp|ie-stand"
冰零界点
11-24 3407
&lt;meta name="renderer" content="webkit|ie-comp|ie-stand"/&gt; 告诉浏览器该页面适合使用什么内核进行渲染； 1.webkit代表用webkit内核； 2.ie-comp代表用IE兼容内核； 3.ie-stand代表用IE标准内核； 4.区分大小写；...
作为前端，你必须要知道的meta标签知识
我本可以容忍阳光，如果我不曾见过太阳，然而阳光已使我荒凉，成为更新的荒凉。
04-28 2547
前言前几天面试baidu的时候，面试官问：你都知道什么meta标签？用处是什么？尽可能多的说出来。我：嗯…… 嗯…… 我一般都自动生成… 面试官：……后来俺找资料好好学了下，再看了taobao和头条的网页才知道：meta标签用处可大得很呐！今天就来浅浅总结一下。顺便感叹一下字节这块适配做的是真的蛮好概览meta标签一般放在整个html页面的head部分，在MDN中对他这样...
HTML中的meta标签及其使用方法
weixin_30585437的博客
08-22 261
组成 meta标签共有两个属性，分别是http-equiv属性和name属性。 1. name属性 name属性主要用于描述网页，比如网页的关键词，叙述等。与之对应的属性值为content，content中的内容是对name填入类型的具体描述，便于搜索引擎抓取。meta标签中name属性语法格式是： <metaname="参数"content="具体的描述">。 其中na...
360浏览器内核 meta name="renderer" 说明文档
编码行者的博客
04-23 2064
自定义切换内核功能说明 浏览器内核模式优先级 手动切换 > 浏览器兼容列表 > meta指定 1、强制锁定极速模式不对外开放（无法切换），比如淘宝、360导航（开发者想用极速模式，建议判断UA是IE，页面提示切换到极速模式） 2、手动切换优先级最高，手动切了兼容模式，以后打开一直是兼容，切了极速模式就一直是极速模式，只能手动切回去，（兼容列表、meta指定都无效） 3、如果您是开发者，...
360安全浏览器浏览模式调整
u010227042的博客
08-25 1811
360安全浏览器在兼容模式下，默认使用IE6/7模式，有时候web只兼容IE8以上，下面谈谈解决360浏览器兼容模式极速模式调整的问题： 设置360安全浏览器打开模式通过meta设置即可，如下： 一、打开页面的模式 1. 默认使用极速模式（webkit内核） <meta name="renderer" content="webkit"> 2.默认使用兼容模式（IE6/7） <meta name="renderer" content="ie-comp"> 3.默认使用
meta 标签内属性及详解
sslcsq的博客
06-15 1035
name 属性 1.keywords 用于告诉搜索引擎，你网页的关键字。举例： <meta name="keywords" content="sslcsq"> 2.description 用于告诉搜索引擎，你网站的主要内容。举例： <meta name="description" content="这是我的世界"> 3.viewport(移动端的窗口) <meta name="viewport" content="width=device-width, initial-sc
video标签360浏览器打不开
最新发布
09-13
根据引用中提供的信息，当使用360浏览器打开包含video标签的网页时可能会出现无法打开的问题。这是因为360浏览器在打开网页时使用的是兼容模式（IE内核），而video标签需要使用极速模式（谷歌内核webkit）来正常播放视频。解决这个问题的方法如下： 1. 在你的vue项目的public文件夹下的index.html文件中，添加一个meta标签： ``` <meta name="renderer" content="webkit"> ``` 确保这个meta标签紧跟着head标签。 这样，在使用360浏览器打开你的网址时，浏览器会默认以极速模式（谷歌内核webkit）来打开你的vue项目，从而解决video标签无法播放的问题。 需要注意的是，如果用户在该网址下手动切换到了兼容模式，则打开的时候仍然会以兼容模式来打开。这是因为浏览器对浏览模式的选择有一定的优先级规则，其中包括强制锁定极速模式、手动切换、meta指定和浏览器兼容列表等。但是大多数用户不会主动切换浏览模式，所以这个问题不会对大多数用户产生影响。 请参考引用中的参考文档链接，了解更多关于360浏览器兼容模式的相关信息。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值