php - WordPress:CSS 属性被取消了？

Question

在我的 page.php 中，我试图输出 .page-wrapper 中的特色图片div 和显示使用 style="background-image: url('<?php echo $thumb['0'];?>') !important;"在页面顶部(内联 css)

问题 是它一直被浏览器划掉。可能是因为有一个第三方插件并且可能会覆盖它 - 所以我尝试添加 !important标记到我的属性(property)。不工作。而且我禁用了插件，不走运。想法??

页面链接:http://radian3.com/events/

这是page.php

<div class="about-container">
<!--  The POST LOOP -->
    <?php  if(have_posts()) :
              while (have_posts()) : the_post(); ?>
                  <?php $thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'full' );?>

                  <div class="page-wrapper" style="background-image: url('<?php echo $thumb['0'];?>') !important;">

                 <b class="about-title"><?php the_title(); ?></b>
                 <!-- <div class="about-icon-wrapper" style="background-image: url('<?php echo $thumb['0'];?>')"></div> -->
                 </div>
                 <div class="contact-body-wrapper">
                 <?php the_content(); ?>    
                 </div> 
                    <?php endwhile; ?>

                        <?php else : 
                            echo '<p>No content found..</p>';

                        endif;         
                    ?>

CSS

/* single.php  page */
.page-wrapper {
    text-align: center;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
/*  background-image: url('../img/about-our-team.jpg') !important;
*/  height: 30rem;
    background-repeat: no-repeat;
    background-size: cover;
}

Answer 1

实际上，是您在 page.php 中的代码执行了重写操作。

您看到的图像划掉了您的 css 文件中包含的 id，带有 emply url 的图像是由您的代码生成的。

您的代码未返回任何图像，因此您需要修复该问题。除非您明确定义了 $post，否则它不会在这里有值，因此 $post->ID 将为空。您应该在循环内使用 get_the_ID()，即

<?php 
$thumb = wp_get_attachment_image_src( get_post_thumbnail_id(get_the_ID()), 'full' );
if ($thumb){
?>
      <div class="page-wrapper" style="background-image: url('<?php echo $thumb['0'];?>')">
<?php 
// rest of your code....
}

仅供引用，您还应该检查以确保 $thumb 具有值 - 如果没有，您可以使用默认占位符代替