陈德馨

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

588人参与 |分类: 站长百科|时间:2013年07月26日 12:10

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

语法:

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

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

保持背景图片的宽高比

background-size:contain

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

保持背景图片的宽高比

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

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

来源:陈德馨博客(微信/QQ号:35435164),转载请保留出处和链接!

地址:

必填

选填

选填

◎已有 0 人评论,请发表您的观点。