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只是顯示白色背景，它甚至沒有註冊後備defautl圖像。

任何人都知道爲什麼這不工作？

謝謝

Answer 1

謝謝您的回答@Mooseman

你的答案幫助，我得到的風格，其作爲與此代碼想要的東西：

.titlearea { 
<?php if(has_post_thumbnail()): ?> 
    /*IE7-*/ background:   url('http://example.com/default.jpg'); 
    /*IE8+*/ background:   url('http://example.com/default.jpg'); 
    background:      -webkit-linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('<?php echo $thumb_url ?>'); 
    background:      -moz-linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('<?php echo $thumb_url ?>'); 
    background:      -ms-linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('<?php echo $thumb_url ?>'); 
    background:      -o-linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('<?php echo $thumb_url ?>'); 
    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://example.com/default.jpg'); 
<?php endif; ?> 
    background-size:    cover; 
    background-position:   50% 0; 
} 

Answer 2

PHP在服務器上運行。你的問題是，IE9不支持linear-gradient。引用this answer：

最好的跨瀏覽器解決方案是

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*/