网页开发里如何让图片只显示中间部分的内容


譬如我有一个背景图片,宽高分别是1400:900,由于屏幕大小限制,只能显示1000:800,那么如何保持图片的原始大小,同时图片显示的范围为图片的正中央。
随着窗口的扩大,显示的内容才会扩大。

css3 web前端开发 web css html5

上条当麻 9 years, 6 months ago

 html {
  height: 100%;
}

body {
  min-height: 100%;
  background:url(../images/img.png) no-repeat center center;
  background-size: cover;
}

chinshu answered 9 years, 6 months ago

background-size:cover
该属性属于css3
低级别浏览器不支持

黑色花人无叶 answered 9 years, 6 months ago

background-position:50% 50%

yowkow answered 9 years, 6 months ago


 html {
  height: 100%;
}

body {
  min-height: 100%;
  background-image: url();
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

背景图要足够大。

葬颜·离字凄 answered 9 years, 6 months ago

Your Answer