Html 如何设置全屏背景图像？

我设法使背景图像适合桌面上的全屏显示，但在移动设备上，它在底部留有一些空间

找到css

*{
填充：0；
保证金：0
}
身体{
背景色：#000000；
}
.crossfade>图{
动画名称：imageAnimation；
动画持续时间：20秒；
动画计时功能：线性；
动画延迟：0s；
动画迭代次数：无限；
背面可见性：隐藏；
背景尺寸：封面；
背景位置：中心；
颜色：透明；
身高：100%；
左：0px；
不透明度：0；
位置：静态；
顶部：0px；
宽度：100%；
z指数：0；
}
.crossfade>图：第n个子项（1）{
背景图片：url（'../Pictures/img5956.JPG'）；
}
.crossfade>图：第n个子项（2）{
动画延迟：10秒；
背景图片：url（'../Pictures/IMG_3497.JPG'）；
}
.crossfade>图：第n个子项（3）{
动画延迟：20秒；
背景图片：url（'../Pictures/IMG_2548.JPG'）；
}
.crossfade>图：第n个子项（4）{
动画延迟：30秒；
背景图片：url（'../Pictures/IMG_1251.JPG'）；
}
.crossfade>图：第n个子项（5）{
动画延迟：40秒；
背景图片：url（'../Pictures/IMG_0429.JPG'）；
}
@关键帧图像动画{
0% {
动画计时功能：轻松自如；
不透明度：0；
}
8% {
动画计时功能：放松；
不透明度：0.3；
}
17% {
不透明度：1
}
25% {
不透明度：1
}
100% {
不透明度：1
}
}
.标题{
位置：相对位置；
z指数：1000；
填充顶部：70px；
填充底部：50px；
左侧填充：50px；
右边填充：50px；
}
.引用{
位置：相对位置；
z指数：1000；
填充底部：50px；
左侧填充：50px；
右边填充：50px；
}
.图标{
位置：相对位置；
底部：0；
保证金：自动；
垫底：20px；
宽度：100%；
文本对齐：居中；
}

适用于移动媒体。将高度设置为100%，背景位置固定

.crossfade>图{
背景：url（图像url）无重复中心固定；
-webkit背景尺寸：封面；
-moz背景尺寸：封面；
-o-背景尺寸：封面；
背景尺寸：封面；
身高：100%；
溢出：隐藏；
}

在IE、Firefox、Opera等其他浏览器上使用此选项[

使用上面的链接

 background-position: center;
 background-repeat: no-repeat;
 background-size: cover;

---

我们可以得到工作代码的链接吗？请同时提供HTML代码或JSFIDLE

  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;

 background-position: center;
 background-repeat: no-repeat;
 background-size: cover;