Question

我试图把图像作为背景。在桌面上它工作得很好但是当我尝试使用我的手机它不起作用。我无法理解为什么，因为我把封面作为背景尺寸而在手机上它应该覆盖所有空间。

这是代码：

CSS

body { 
    background-image: url('/nutickets/images/bluenight.jpg');
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    background-position: center center;
}

HTML

<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta charset="utf-8" />
    <link rel="stylesheet" type="text/css" href="/nutickets/style.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>

<body>

</body>

</html>

我的手机上的图片

如果我查看Chrome的Toogle设备工具栏，一切都可以，但是当我尝试使用我的智能手机时，它无法正常工作。我刷新缓存，我试图隐姓埋名，我尝试使用不同的移动浏览器，但没有。

Answer 1

这对我的Android设备有用 - 尝试强制html元素覆盖设备的整个高度：

 <?php 
 $terms = get_terms('location');
 foreach( $terms as $term ):
 ?>                          

 <?php                         
 $posts = get_posts(array(
 'post_type' => 'country',
 'taxonomy' => $term->taxonomy,
 'term' => $term->slug,                                  
 'nopaging' => true, // 
 'offset' => 0,
 ));
 foreach($posts as $post): 
 setup_postdata($post); 
 ?>        
 test    
 <?php endforeach; ?>

 <?php endforeach; ?>

如何使用图片填充移动设备中的背景

1 个答案: