背景图像比视大

让说我对智能手机访问我的网站背景图像比视大

<meta name="viewport" content="width=360, initial-scale=1.0, user-scalable=no" />

和1000×1000像一个大的背景图像。

我只希望能够修复我的背景图像的大小，即使它比视口大，以允许像缩放这样的东西。

<body style="background: black url('pic.jpg') no-repeat; ">

正常工作与原来的大小，但

<body style="background: black url('pic.jpg') no-repeat; background-size:750px">

限制我的图片视口宽度的大小。

所以我的问题：如果背景图像的尺寸大于视口宽度，我怎么能设置背景图像的尺寸为任何值？

2017-07-30 blueace

将background-size设置为100% 100%以拉伸并且不保留宽高比。

将background-size设置为cover以拉伸，裁剪冗余部分并保留宽高比。

设置background-size到contain拉伸，在需要的地方添加额外空间并保留宽高比。

2017-07-30 15:42:37

回答