css - 一个好的默认背景图像类型和大小

Question

我正在使用它来设置我的背景图像。

body{
  background: url('path_to_image');
  background-size: 100%;
}

我对如何background-size处理屏幕尺寸的微小差异感到满意。

我正在将 gimp 中的背景图像设计为蓝色抽象图像。什么尺寸适合处理最常见的屏幕尺寸（像素宽度和高度），以及导出它的好的图像格式是什么？

这是我测试过的一张背景图片的示例：

http://dooid.me/images/uploads/1334771136brentreader.gif

浏览器报告的最常见的屏幕尺寸（链接在这里）似乎是：

1366x768

Answer 1

如果这是当今最常见的屏幕分辨率，那么 1366x768 听起来不错。如果您的图像具有许多渐变和细微细节，则文件类型应为 .jpg，如果您的图像主要是没有抗锯齿的实心形状（例如像素艺术），则文件类型应为 .png（或 .gif）。导出图像时，请始终牢记质量和文件大小！

使用抽象图像作为背景也很好，因为使用background-size:100%会导致非预期分辨率的拉伸（如果使用更多具象的图片会显得很愚蠢！）。