带有图像的ACF帖子，与html和css一起使用 - ACF post with an image, used with html and css

ACF post with an image, used with html and css

本文关键字：html css 一起图像 ACF 帖子 | 更新日期: 2023-09-27

我查询了一个带有图像和名称的帖子，但我想将此图像用作背景，并在中心显示文本，如下所示：

http://gyazo.com/d71a4cc0a7afeaa672b9b3a7d22bc092

当 php 变量中同时包含两个元素时，如何将此图像用作中心文本框中的背景？

这是我的代码：

    <?php
        $args = array(
    'post_type' => 'alimento',
);
$the_query = new WP_Query( $args );
    if ( $the_query->have_posts() ) {
        while ( $the_query->have_posts() ) {
            $the_query->the_post(); 
            $nombre = get_the_title();
            $imagen_1 = get_field('imagen_principal_alimentos');
            ?>
            <div class="col-sm-4">
                <img src="<?php echo $imagen_1['url']; ?>">
            </div>
            <?php
        } 
    } 
    ?>

@Bob Xplosion：使用css的内联样式属性来实现您的需求不知何故像这样。

假设我有一个名为"alimento_featured_image"的图像字段，那么我将这样做

而（ $the_query->have_posts（）） { $the_query->the_post（）;

        $nombre = get_the_title();
        $imagen_1 = get_field('imagen_principal_alimentos');
        ?>
        <div class="col-sm-4" <?php if($imagen_1 != "" and $imagen_1 != NULL){?>style="background:url(<?php echo $imagen_1;?>);"<?php }?>>
            <?php echo $nombre;?>
        </div>
        <?php
    } ?>