如何解决360的兼容模式下页面的样式会错乱
2017-04-28 13:44
411 查看
360的极速模式下页面打开样式完好
一旦用兼容模式打开,页面样式就全部错乱了
解决方法:我们在用idea新建jsp的时候,页面没有自动生成<!DOCTYPE html>
这行代码,把这行代码加上去就OK了。
下面我就尽可能简洁扼要的说一下DOCTYPE的作用和用法。
<!DOCTYPE> 声明必须是 HTML 文档的第一行,位于 <html> 标签之前。
<!DOCTYPE> 声明不是 HTML 标签;它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。
在 HTML 4.01 中,<!DOCTYPE> 声明引用 DTD,因为 HTML 4.01 基于 SGML。DTD 规定了标记语言的规则,这样浏览器才能正确地呈现内容。
HTML5 不基于 SGML,所以不需要引用 DTD。
1作用:声明文档的解析类型(document.compatMode),避免浏览器的怪异模式。
document.compatMode:
BackCompat:怪异模式,浏览器使用自己的怪异模式解析渲染页面。
CSS1Compat:标准模式,浏览器使用W3C的标准解析渲染页面。
这个属性会被浏览器识别并使用,但是如果你的页面没有DOCTYPE的声明,那么compatMode默认就是BackCompat,
这也就是恶魔的开始 -- 浏览器按照自己的方式解析渲染页面,那么,在不同的浏览器就会显示不同的样式。
如果你的页面添加了<!DOCTYPE html>那么,那么就等同于开启了标准模式,那么浏览器就得老老实实的按照W3C的
标准解析渲染页面,这样一来,你的页面在所有的浏览器里显示的就都是一个样子了。
这就是<!DOCTYPE html>的作用。
2使用:<!DOCTYPE html>
2.1 使用也很简单,就是在你的html页面的第一行添加"<!DOCTYPE html>"一行代码就可以了
2.2 jsp的话,添加在<%@ page %>的下一行。
2.3 不用区分大小写哦
详细介绍请查看全文:https://cnblogs.com/qianzf/
原文博客的链接地址:https://cnblogs.com/qzf/
一旦用兼容模式打开,页面样式就全部错乱了
解决方法:我们在用idea新建jsp的时候,页面没有自动生成<!DOCTYPE html>
这行代码,把这行代码加上去就OK了。
下面我就尽可能简洁扼要的说一下DOCTYPE的作用和用法。
<!DOCTYPE> 声明必须是 HTML 文档的第一行,位于 <html> 标签之前。
<!DOCTYPE> 声明不是 HTML 标签;它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。
在 HTML 4.01 中,<!DOCTYPE> 声明引用 DTD,因为 HTML 4.01 基于 SGML。DTD 规定了标记语言的规则,这样浏览器才能正确地呈现内容。
HTML5 不基于 SGML,所以不需要引用 DTD。
1作用:声明文档的解析类型(document.compatMode),避免浏览器的怪异模式。
document.compatMode:
BackCompat:怪异模式,浏览器使用自己的怪异模式解析渲染页面。
CSS1Compat:标准模式,浏览器使用W3C的标准解析渲染页面。
这个属性会被浏览器识别并使用,但是如果你的页面没有DOCTYPE的声明,那么compatMode默认就是BackCompat,
这也就是恶魔的开始 -- 浏览器按照自己的方式解析渲染页面,那么,在不同的浏览器就会显示不同的样式。
如果你的页面添加了<!DOCTYPE html>那么,那么就等同于开启了标准模式,那么浏览器就得老老实实的按照W3C的
标准解析渲染页面,这样一来,你的页面在所有的浏览器里显示的就都是一个样子了。
这就是<!DOCTYPE html>的作用。
2使用:<!DOCTYPE html>
2.1 使用也很简单,就是在你的html页面的第一行添加"<!DOCTYPE html>"一行代码就可以了
2.2 jsp的话,添加在<%@ page %>的下一行。
2.3 不用区分大小写哦
详细介绍请查看全文:https://cnblogs.com/qianzf/
原文博客的链接地址:https://cnblogs.com/qzf/
相关文章推荐
- 解决360双核浏览器兼容模式的页面显示问题
- 兼容模式下页面样式错乱问题
- IE8和360兼容模式下页面排版出问题的解决办法
- IE兼容模式下排版错乱问题解决
- 解决css3动画效果在360兼容模式跟猎豹浏览器下不兼容
- 解决ie7和360不兼容的样式和js等问题。
- 解决360、猎豹浏览器等极速模式下css3兼容问题
- 360极速模式与兼容模式的样式
- 360兼容模式网站界面错乱及部分功能失效
- 如何解决IE6下div错位的问题,以及IE7、IE8样式不兼容问题
- Angularjs在360兼容模式下取数据缓存问题的解决办法
- 浏览器兼容性问题:页面错乱 兼容模式和急速模式
- 浅谈解决360兼容模式浏览器的方法
- 解决360 兼容模式下问题。
- 解决360浏览器兼容模式的页面显示问题
- 解决360浏览器兼容模式的页面显示问题
- 用Meta标签代码让360双核浏览器默认极速模式打开网站不是兼容模式(顺带解决很多兼容性问题)
- 解决360浏览器兼容模式的页面显示问题
- jsp页面解决IE浏览器兼容模式下css,js显示问题
- 用js解决jquery在360兼容模式下不起作用的事例