php - Styles.php 有条件的 PHP/CSS 在 IE 9 中不工作

Question

我有一个使用此代码调用的 style.php 设置:

<?php include (TEMPLATEPATH . '/includes/css/styles.php');?>

此样式表包含此代码:

<?php $thumb_id = get_post_thumbnail_id();
$thumb_url_array = wp_get_attachment_image_src($thumb_id, 'title-image', true);
$thumb_url = $thumb_url_array[0]; ?>

<style>

/* GET FEATURED IMAGE FOR TITLE BACKGROUND */
.titlearea {
<?php if(has_post_thumbnail()): ?>
background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('<?php echo $thumb_url ?>');
<?php else: ?>
background: url('http://www.example.com/wp-content/themes/my-custom-theme/includes/images/services-top.jpg');
<?php endif; ?>
background-size: cover;
background-position: 50% 0;
}
</style>

它应该寻找帖子缩略图(我使用 Wordpress)并将其显示为背景图片(如果有的话)，如果页面没有缩略图则它应该回退到默认值(services-top.jpg)。

此代码在 Chome 和 Firefox 中运行良好，但 IE9 仅显示白色背景，甚至没有注册后备默认图像。

有人知道为什么这不起作用吗？

谢谢

Answer 1

PHP 在服务器上运行。你的问题是 IE9 不支持 linear-gradient。引用 this answer :

The best cross-browser solution is

background: #fff;
background: -moz-linear-gradient(#fff, #000);
background: -webkit-linear-gradient(#fff, #000);
background: -o-linear-gradient(#fff, #000);
background: -ms-linear-gradient(#fff, #000);/*For IE10*/
background: linear-gradient(#fff, #000);
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#ffffff', endColorstr='#000000');/*For IE7-8-9*/ 
height: 1%;/*For IE7*/