Question

我将帖子/页面精选图像作为内联背景图像。

以下代码适用于大多数浏览器，但不适用于Safari 6.0及以下版本。

在Safari 6.0上，内联样式会跳过background:url('xxx') no-repeat scroll xxx xxx / cover;并直接转到min-height:(...)。

background-attachment也没有在DOM中显示。

单个项目网站的示例：http://skarpsinn.no/prosjekter/oeva。试试前。 Chrome和Safari 6.0。这是我单页的PHP代码 - 在其他页面上几乎相同。

            <?php if(is_single()): 
                $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' ); 
            ?>
                <?php if ( has_post_thumbnail() ) { ?> 
                    <div class="featured_image" style="background: url('<?php echo $image[0]; ?>') no-repeat scroll <?php the_field('bg_vert_posisjon'); ?> <?php the_field('bg_hor_posisjon'); ?> / cover; min-height: 700px; position: relative; width: 100%; background-attachment: <?php the_field('bg_oppforsel'); ?>">
                <?php } else { ?>
                <div class="no_feature_image"></div>
                <?php } ?>

任何输入都会有所帮助！谢谢！

Answer 1

您的问题似乎与

有关

background: url('http://skarpsinn.no/wp-content/uploads/2014/04/banner_oeva.png') no-repeat scroll center center / cover

如果删除/ cover并将其放在自己的行上，它应该可以正常工作。风格是：

background: url('http://skarpsinn.no/wp-content/uploads/2014/04/banner_oeva.png') no-repeat     scroll center center;
min-height: 700px;
position: relative;
width: 100%;
background-attachment: initial;
background-size: cover;

（在sarafi 5.1.7上这对我有用）

WP：内联样式背景图像 - 不工作Safari 6.0及以下

1 个答案: