0

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

下面的代码在大多数浏览器上都能完美运行，但不能在 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 } ?>

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

4

1 回答 1

0

你的问题似乎与

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 上这样做对我有用）

于 2014-04-08T08:33:24.780 回答