CSS3如何实现背景图片拉伸铺满整个页面

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

语法:

CSS

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

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

保持背景图片的宽高比

CSS

background-size:contain

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

保持背景图片的宽高比

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

CSS

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

赞 (0)