HTML – IE11不会背景大小:封面

HTML – IE11不会背景大小:封面,第1张

概述我有一个div #service_wrap它有一个图像应该覆盖100%的页面宽度它在firefox,chrome和edge中工作得很好.但是IE 11它使图像居中并且不包括div 什么是IE相当于background-size:cover; CSS #service_wrap{padding:0;margin:0;width:100%;height:750px;max-height:75 我有一个div #service_wrap它有一个图像应该覆盖100%的页面宽度它在firefox,Chrome和edge中工作得很好.但是IE 11它使图像居中并且不包括div
什么是IE相当于background-size:cover;

CSS

#service_wrap{padding:0;margin:0;wIDth:100%;height:750px;max-height:750px;display:table;background: url(../images/service_header.jpg) no-repeat center center; -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;}

HTML

<div ID="service_wrap" ><div ID="service_top" ><h1>WE WORK CLOSELY WITH OUR PARTNERS TO GET YOU THE BEST SERVICE.</h1><h2>Click on a service below to learn more about how we partner with each one.</h2></div><!--service_top--><div ID="service_bottom" ><div ><a href=""><div ></div></a><!--service1--><a href=""><div ></div></a><!--service2--><a href=""><div ></div></a><!--service3--><a href=""><div ></div></a><!--service4--><a href=""><div ></div></a><!--service5--><a href=""><div ></div></a><!--service4--><a href=""><div ></div></a><!--service5--></div><!--services_holder--></div><!--service_bottom--></div><!--service_wrap-->

如果您将以下代码插入IE11上的网页,则不会使用全宽

<!DOCTYPE HTML><head><Meta charset="utf-8"><Title>this is a Title</Title><link rel="stylesheet" href="CSS/partners.CSS" type="text/CSS" /><link rel="stylesheet" href="CSS/style.CSS" type="text/CSS" /><style>#service_wrap{background: url(http://test.finelinewow.com/images/partner_header.jpg) no-repeat center center; -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;}	</style></head><body><!----------------------------------------------------------------service---------------------------------------------------------------->   <div ID="service_wrap" ><div ID="service_top" ><h1>WE WORK CLOSELY WITH OUR PARTNERS TO GET YOU THE BEST SERVICE.</h1><h2>Click on a service below to learn more about how we partner with each one.</h2></div><!--service_top--><div ID="service_bottom" ><div ><a href="#liberty_towing"><div ></div></a><!--service1--><a href="#auto_palace"><div ></div></a><!--service2--><a href="#discount_auto"><div ></div></a><!--service3--><a href="#speedy_car"><div ></div></a><!--service4--><a href="#solID_insurance"><div ></div></a><!--service5--><a href="#sevan_auto"><div ></div></a><!--service4--><a href="#gray_gables"><div ></div></a><!--service5--></div><!--services_holder--></div><!--service_bottom--></div><!--service_wrap--><!----------------------------------------------------------------/service---------------------------------------------------------------->  </body></HTML>
解决方法
<Meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1">

解决了这个问题.代码可以在本地机器,jfiddle和codepen上工作,但在上传网站时,需要添加上述代码才能正确显示.

总结

以上是内存溢出为你收集整理的HTML – IE11不会背景大小封面全部内容,希望文章能够帮你解决HTML – IE11不会背景大小:封面所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/web/1086966.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2022-05-27
下一篇2022-05-27

发表评论

登录后才能评论

评论列表(0条)

    保存