Question

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

问题是它一直被浏览器划掉。这可能是因为有第三方插件可能会覆盖它 - 所以我尝试将!important标记添加到我的媒体资源中。不工作。而且我已禁用该插件，没有运气。 IDEAS ??

链接到页面：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，其中包含您的代码生成的网址。

您的代码未返回任何图片，因此您需要修复此问题。除非你明确定义了$ post，否则它不会有值，所以$ post-＆gt; ID将为空。你应该在循环内use 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有值 - 如果没有，您可以使用默认占位符

Answer 2

您需要删除内联样式属性，该属性不会为其设置图像，但它会覆盖page-wrapper

的背景图片网址的css

您需要从page-wrapper div。

中删除以下属性

style="background-image: url('') !important;"

Answer 3

请这样给出

background-image: url("<?php bloginfo('template_directory'); ?>/images/parallax_image.jpg ");

WordPress：CSS属性被取消了吗？

3 个答案: