전체 화면 배경 이미지 크기 조정

Question

배경 이미지를 전체 화면으로 설정하려고하는데 창 크기를 조정할 때 이미지 크기가 실제 픽셀 크기를 변경하지 않지만 작아지듯합니다 (자르기 형).

이

가 무슨 뜻입니다 : 이제 http://jsfiddle.net/G7Qc4/

을 (창 크기를 조정하고 사진이 작거나 큰 얻을 수 있지만, 픽셀 화하지 않는 것을 알 수보십시오) 때문에 이미지의 위 작품 사업부의 배경이다 내가 설정 한 :

background-position: center top;

내 질문에 내가 그것을 작동하게 할 수있는 방법 인 작동하지 않습니다 <img> 그냥 일반라면? 주위에 어떤 방법이 있다면?

div의 이미지를 허용하지 않는 nivoSlider를 사용하고 있으므로 <img>을 사용해야합니다. 그것은과 같이, CSS3 (background-size: cover)을 수행 할 수 있습니다

Answer 1

, 당신은 배경 대신 배경 이미지로 실제 태그를 사용하고 싶습니다. http://jsfiddle.net/ttZeM/

그것은 배경 이미지의 크기를 알 필요

여기 내 솔루션입니다.

절대적으로 배치 된 배경을 보유하는 div가 있으며, 사이트 내용은 절대적으로 그 위에 배치됩니다.

배경 이미지를 중앙에 배치하려면 왼쪽으로 -500 픽셀을 이동 시키십시오. 절반의 너비입니다. 그것은 0px 너비의 div 내부에 있으며 position:absolute; left:50%이라는 이상한 기법이 중심이지만 이미지 크기를 알면 작동합니다.

또한 bg_wrap div에는 overflow : hidden이 있습니다. 및 너비 : 100 %; 즉, 화면 가장자리에서 스크롤 막대가 보이지 않습니다.

나는 이것이 당신이 원했던 것입니다!

Answer 2

작정

감사 : 이해하면 http://jsfiddle.net/mqchen/Kq3pa/