根据你的CSS代码，这里的repeat表示背景图片进行水平及垂直平铺。平铺不会照成图片的模糊。因为是背景图，height也不会影响到图片模糊。
有可能是你自己不小心把浏览器的显示放大了（按住了ctrl键并滑动了鼠标滚轮或者按住ctrl键并按了+键，这样都会放大浏览器显示），照成了在浏览器中观看图片比在图片查看软件中的原图片要模糊，只要调整回去即可。点击浏览器空白处，然后同时按住ctrl键 和 0键（这里是零，不是o） ，即可恢复原状。
在默认状态下（或者说不做任何特殊的css设置的情况下），作为背景的图片都是不失真地进行平铺的啊。当然，我所理解的“不失真”是指图片的长宽比例保持不变，如果你有其他的解释请说明。
background-size: width height|cover|contain需要指定两个100%：background-size: 100% 100%
否则，高度将被指定为 auto。
或者使用 background-size: contain
这样，图片将被包含在显示区域内，需要的话会被缩放。
如果图片比例与显示区域比例不匹配的话，100%的情况下，图片会有失真，而contain的情况下，图片将不能填充满整个显示区域。
另外，background-size是CSS3属性，IE9以下不支持，因此如果需要更好的兼容性的话，可能需要把background变成img标签。
