返回首页
当前位置: 主页 > 编程语言 > CSS教程 >

CSS实现背景图片拉伸铺满整个页面的方法

时间:2017-03-16 12:57来源:电脑教程学习网 www.etwiki.cn 编辑:admin

在CSS3中可以使用background-size设置背景图片的大小。

语法:


CSS
background-size :[ <length> | <percentage> | auto ]{1,2} | cover | contain
background-size:cover12

调整背景图片的宽度或高度(较小者),以铺满整个元素。

保持背景图片的宽高比


CSS
background-size:contain1

调整背景图片的宽度或高度(较大者),使背景图片完全包含在元素中

保持背景图片的宽高比

如上所述,只要将background-size设为cover,则可以将背景图片铺满整个页面。


CSS
body{
background: #1e90ff url(/static/dashboard/img/bg-splash.jpg) center center no-repeat fixed;
background-size: cover;
}

------分隔线----------------------------
标签(Tag):css
------分隔线----------------------------
推荐内容
猜你感兴趣