我添加了页脚背景图片。它在我的电脑上看起来很完美。但它在 iPad 浏览器上显示不正确。我正在尝试上传图片给你看,但我对stackoverflow很陌生,所以我不能上传。如果有人知道如何给你看图片。请让我知道我会上传它。请看右下角的黑色部分。任何人都请帮我解决这个问题
谢谢
我将此行添加到我的 css 中。
.footer{ border-top: 4px solid #00b0bd; }
.footer a{ color: #000000;}
.footer-container { width:100%; text-align: left; background: url("../images/footer/footer_damask.gif") repeat scroll 0 0 #333333;}
.footer { margin: 0 auto 15px; width: 960px; }
.aditional-footer { margin:0 auto 0; padding: 30px 0 30px; width: 960px; background-image:none !important;}
.footer .links li { text-transform: none; }
.footer-container a { color:#666669; font-size: 11px; width: 960px; }
.footer-container .footer-right { width: 250px; }
.footer .f-right { width:429px; text-align: right; padding-right:20px; }
这是我的完整 CSS。
/* Footer ================================================================================ */
.footer-social-container { width:100%; background: none repeat scroll 0 0 #404040; border-top: 0 solid #00aebb;}
.footer-social { width:960px; padding: 5px 0; margin:0 auto; }
.footer-social .phone { color:#111; float:right; font-size:16px; }
.footer-social .follow_us { display: inline-block; font-size: 16px; margin: 0; float: left; color:#ffffff; }
.footer-social .twitter,
.footer-social .rss,
.footer-social .facebook { margin-left: 5px; text-indent: -9999px; display: inline-block; float: left; background-repeat: no-repeat; background-position: top center; height:24px; width:30px; }
.footer-social .twitter:hover,
.footer-social .rss:hover,
.footer-social .facebook:hover { background-position: bottom center; }
.footer-social .twitter { background-image: url(../images/twitter.png); }
.footer-social .rss { background-image: url(../images/rss.png); }
.footer-social .facebook { background-image: url(../images/facebook.png); }
.footer-social .gift_img { float: left; border-left: 1px solid #00afbc; border-right: 1px solid #00afbc; padding: 0 50px; margin: 0 0 0 100px; }
.footer{ border-top: 4px solid #00b0bd; }
.footer a{ color: #000000;}
.footer-container { width:100%; text-align: left; background: url("../images/footer/footer_damask.gif") repeat scroll 0 0 #333333;}
.footer { margin: 0 auto 15px; width: 960px; }
.aditional-footer { margin:0 auto 0; padding: 30px 0 30px; width: 960px; background-image:none !important;}
.footer .links li { text-transform: none; }
.footer-container a { color:#666669; font-size: 11px; width: 960px; }
.footer-container .footer-right { width: 250px; }
.footer .f-right { width:429px; text-align: right; padding-right:20px; }
.footer ul { display:inline; }
.footer li { display:inline; background:url(../images/bkg_pipe1.gif) 100% 50% no-repeat; padding:0 5px 0 0; margin:0 3px 0 0; }
.footer .links li.last { background:none !important; padding-right:0 !important; }
.footer .bugs { margin:0; color:#666; }
.footer .bugs a { font-weight:bold; color:#353535; }
.footer address { color:#666; }
.footer address a { color:#353535; }
.policy li { margin-left:2px; padding-left:10px ; line-height: 1.5; background: url(../images/footer_li.png) no-repeat left top;}
.policy li:hover { background: url(../images/footer_li.png) no-repeat left bottom;}
.footer-container .form-subscribe { }
.footer-container .form-subscribe label { padding-top:2px; font-weight:bold; color:#555; }
.footer-container .form-subscribe .input-box { border: 1px solid #EFEFEF; width: auto; float: left; height: 27px;}
.footer-container .form-subscribe button.button { float:left; width: 58px;}
.footer-container .form-subscribe button.button span { height: 22px; font: normal 11px/22px Tahoma, Verdana, Arial, sans-serif; }
.footer-container .form-subscribe input.input-text { width: 180px; border: 0px solid #d6d4d4; border-right:0; padding: 0; padding-left: 8px; float:left; height: 27px; line-height: 27px; }
.footer-container .form-subscribe input.input-text:focus { border: 1px solid #FF292C; border-right: 0; height: 25px; line-height: 15px }
.footer-container .form-subscribe input.input-text.validation-failed { background: none!important; border-right:0!important; }
.footer-container .form-subscribe .validation-advice { position: absolute; width: 171px; margin-top: 31px; background: white; padding:5px; }
.footer-container .footer-callout { display:block; margin:-10px 0 10px; position:relative; }
.footer-container .store-switcher { color:#555; text-align:right; }
.footer-container .store-switcher label { font-weight:bold; vertical-align:middle; }
.footer-container .store-switcher select { padding:0; vertical-align:middle; }
.footer-container .bottom-container { margin:0 0 8px; text-align:right; }
/* ======================================================================================= */