造型背景图像。 Wordpress，php。

Question

我正在使用Wordpress，而我目前正在尝试为作为背景图片的图片添加宽度，但我似乎无法这样做。 ..

图片位于页面顶部：http://ideedev.co.uk/newseed/brand/我的文字按我想要的方式工作（中间和中间使用垂直对齐和dimply：table;和表格单元格），在背景中的图像似乎是全尺寸，但我想使它与容器的宽度相同，它是...的背景。

作为参考，完整图像如下所示：

我正在使用页面的精选图片，所以为了将其拉到后台，我必须使用一些PHP，所以这里是显示图像和文本的代码：

<?php if ( has_post_thumbnail() ) {

    // Get the post thumbnail URL
    $feat_image = wp_get_attachment_url( get_post_thumbnail_id($post->ID) );
  } else {

    ?>
    <style type="text/css">.featured-image{
    display:none;
    }</style>
    <?php
  } ?>


    <div id="absolute1111" style=" background: url(<?php echo $feat_image; ?>);">
        <div class="centerd1111">
            <h1><?php the_title(); ?></h1>
        </div>
    </div>  

我的风格如下：

#absolute1111 {
    position:relative;
    width:100%;
    height:50%;
    display:table;
    color: #fff;
}

.centerd1111 {
    display:table-cell;
    vertical-align:middle;
    text-align:center;
    height:500px;
    padding: 0 50px 0 50px;
}

希望有人能够提供帮助:)感谢您的光临。

Answer 1

如果我理解正确，这就是你想要的：

#absolute1111 {
   position:relative;
   width:100%;
   height:50%;
   display:table;
   color: #fff;
   background-size: contain;
   background-repeat: no-repeat;
   background-color: #274c55;
   background-position-x: 50%; # See comments below about standards
}

它看起来像这样：

Answer 2

我有点不清楚。我想你可以在css中添加以下内容：

#absolute1111 {
    position:relative;
    width:100%;
    height:50%;
    display:table;
    color: #fff;
    background-repeat: no-repeat;
    background-size: cover;
}