배경 이미지가 div에 표시되지 않지만 본문 태그에 표시됩니다.

내 웹 페이지가 다른 해상도로 어떻게 표시되는지 확인하기 위해 친구 집에 갔지만 배경 이미지가 측면에 도달하지 않은 것으로 나타났습니다. 그래서 집에 가서 조사를하고 body 태그에 배경 이미지가있는 대신 body 태그 안에 div를 작성해야 container div 앞에 올 수 있습니다.배경 이미지가 div에 표시되지 않지만 본문 태그에 표시됩니다.

내 디자인 중 하나는 효과가 있었지만 다른 디자인에서는 효과가 없었습니다. 코드는 동일했지만 이미지는 그렇지 않았습니다.

내 CSS에 position:absolute을 추가하려고 시도했지만 표시되지만 위쪽과 왼쪽에 이상한 흰색 테두리가 있습니다.

이 문제를 어떻게 해결할 수 있습니까?

HTML :

<html> 
    <head></head> 
    <body> 
     <div class="background"> 
     </div> 
     <div class="container"> 
     </div> 
    </body> 
</html>

CSS :

body{ 
    text-align:center; 
} 

.background{ 
    background:url('images/background.png')no-repeat; 
    width:100%; 
    height:100%; 
    background-position:center; 
}

출처

2012-09-30 user1710105

images/background.png의 크기는 무엇입니까? – Eric

당신이 우리가 자세히 볼 수 있도록 당신이 말하는 웹 페이지에 링크하거나 [jsFiddle] (http://jsfiddle.net/)에 예제를 넣을 수 있다고 생각하십니까? – Michael0x2a

매우 충분하지 않습니다 정말 당신에게 좋은 대답을 줄 수있는 정보 ...하지만 상단에 흰색 라인의 왼쪽 body 태그에 추가 된 자연 여백과 같은 페이지 사운드. 당신이 당신의 CSS는이를 추가 할 경우는 제거해야합니다 :

body { 
margin: 0px; 
}

또한, "측면에 도달"배경 이미지는보기 화면 해상도와 브라우저 크기를 기준으로 이미지의 크기에 주로 의존한다. 이러한 요소는 사용자가 제어 할 수 없으므로 디자인 배경에서 이미지를 사용하는 곳을 신중히 선택하십시오.

출처

2012-09-30 18:04:53 Mike

약간 확장하면됩니다 - OP, CSS 재설정에 대해 배우고 싶을 수도 있습니다. 제대로 사용하면 많은 브라우저의 기본 여백, 패딩 등을 제거하므로보다 일관된 출발점을 갖게됩니다. – Ryan

와우, 내 질문에 대한 빠른 답장과 편집을 주셔서 감사합니다. html과 css에 처음 나왔을 때, 내 질문에 대한 형식이 유감 스럽다는 이유로 1 주일이 걸렸습니다. 순간 나는 당신의 해답을 시험 할 수 없지만 오늘 내 배경 이미지가 모든 결의안을 다루기에 충분히 커야한다고 생각한다면? 그리고 나는 내 질문에 이것을 추가하지만 배경의 CSS 태그에 추가 할 때 배경이 표시되지만 내가 .background로 이동하면 표시되지 않을 것이라고 생각했습니다. 나는이 jsfiddle 전에 들었지만 il 오늘 밤 봐, 덕분에 힙을 – user1710105

헤이 또한 생각하고 있었어, 나에게 unapropaite 있다면 알려주지 만, 나는 당신이 그것을 확인해 볼 수 있도록 mediafire 다운로드 링크를 줄 수있다. 심지어 내가하는 일에 대해 몇 가지 코멘트를 주시겠습니까? – user1710105

배경 이미지가 div에 표시되지 않지만 본문 태그에 표시됩니다.

답변

관련 문제