내 배경 CSS 이미지가 보이지 않는 이유는 무엇입니까

배경 이미지는 내 머리글과 탐색 모음과 일치하는 두 개의 컬러 막대입니다. 난 그냥 수평으로 반복하지만 그 표시되지 싶어요. 내 파일과 이미지를 보여주는 스크린 샷을 보여줍니다. enter image description here 내 배경 CSS 이미지가 보이지 않는 이유는 무엇입니까

어떤 도움을 주셔서 감사합니다!

HTML

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8" /> 
    <title>Tech MAX'd</title> 
    <link rel="stylesheet" href="css/main.css" type="text/css"/> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> 
    <script src="js/general.js" type="text/javascript"></script> 
</head> 


<body> 
    <div id="big_wrapper"> 
     <header id="top_header"> 
     <h1>Welcome to Tech MAX'd</h1> 
     </header> 

     <nav id="top_nav"> 
     <ul> 
      <li>...

CSS

*{ 
    margin:0px; 
    padding:0px; 
} 
h1{ 
    padding: 2px; 
    color: #ffffff; 
    font: 24px Palatino; 
    display: inline-block; 
} 
h2{ 
    font: bold 14px Palatino; 
} 
header, section, footer, aside, nav, article, hgroup{ 
    display:block; 
} 
body{ 
margin: 0px; 
padding: 0px; 
text-align: center; 
background: #e0e0e0 url(images/tmbackground.gif) repeat-x; 
} 
#big_wrapper{ 
    min-width:1000px; 
    max-width: 1000px; 
    margin: auto; 
    text-align:left; 
} 
#top_header{ 
    padding:20px; 
    background-color: #820000; 
} 
#top_nav{ 
    padding:7px 7px 7px 20px; /* top,right,bottom,left */ 
    background: -webkit-gradient(linear, left top, left bottom, from(#e9e9e9), to(#b6b6b6)) 
} 
#top_nav li{ 
    display:inline-block; 
    list-style:none; 
    padding-right:25px; /*space between links*/ 
    font: bold 14px Tahoma; 
} 
a.topLinks{ 
    color: #4e4e4e; 
    font: bold 16px Century; 
    text-decoration: none 
} 
a.topLinks:hover{ 
    color: #820000; 
    font: bold 16px Century; 
    text-decoration: none 
} 
#new_div{ 
    display:inline; 
} 
#main_section{ 
    min-width: 630px; 
    max-width: 630px; 
    border: 1px solid #820000; 
    background-color: white; 
    float: left; 
    margin: 20px; 
    padding: 20px; 
} 
#side_news_banner{ 
    float: left; 
    margin-top: 20px; 
    margin-left: 15px; 
} 
.side_news{ 
    border: 1px solid red; 
    width:220px; 
    margin: 20px 0px; 
    padding: 30px; 
    background: #66CCCC; 
} 
#the_footer{ 
    clear: both; 
    text-align:center; 
    padding: 20px; 
    border-top: 2px solid green; 
} 
article { 
    background: #FFFBCC; 
    border: 1px solid ; 
    padding: 20px; 
    margin-bottom: 10px; 
} 
article footer{ 
    text-align:right; 
}

출처

2012-04-08 mharris7190

사용중인 이미지를 볼 수 있도록 '테스트'페이지에 대한 링크를 제공 할 수 있습니까? url (images/background.gif)보다는? 또는 www.jsfiddle.net => 왼쪽 위 상자에 코드를 입력하고 오른쪽 상단에 css를 입력 한 다음 Ctrl + Enter를 누릅니다 –

여기에서 사용하는 소프트웨어 방법으로? 그것은 나에게 재미있는 것 같습니다 :) – Asif

는 CSS의 하위 디렉토리, 당신은 위치가 CSS 파일을 기준으로하기 때문에

url(../images/background.gif)

를 사용해야합니다.

또한 일반적으로 셀렉터와 '{'즉, body{이 아닌 body { 사이에 공백을 두어야합니다.

출처

2012-04-08 19:06:02

내가 이미지 폴더를 css 폴더에 넣었을 때 작동하지만 어떻게 이미지 폴더를 css 폴더에 넣어야합니까? – mharris7190

Nevermind, 나는 두 개의 마침표 (예 : ../images/background.gif)를 두 마침표로 입력한다는 사실을 깨달았습니다. 마침표 두 개가 폴더 계층의 한 수준 위로 올라옵니다. 정말 고마워요! – mharris7190

~~확율은 당신이 http://example.com/images/background.gif에서 그것을 유지하는~~ 점이다. 귀하의 스타일 시트가 http://example.com/css/images/background.gif에 있음을 나타내므로 404 오류가 발생합니다.

출처

2012-04-08 19:02:54 Quentin

고맙습니다! 이것은 내가 내 CSS 폴더 안에 내 이미지 폴더를 넣었을 때 지금 작동하는 이유입니다. 하지만 어떻게 내부 CSS (...) 내부에서 내 이미지 폴더를 집어 넣을 필요가없는 폴더를 참조합니까? – mharris7190

본문에 너비 속성이 필요한 이유는 무엇입니까? 그러나 문제는 귀하의 URL에있을 수 있습니다. 나는 그것이 "/images/background.gif"가되어야한다고 생각합니다. "images/background.gif"를 입력하면 css/images/background.gif가 지정됩니다. 디렉토리 이미지를하지 않는 한

출처

2012-04-08 19:04:01

내 배경 CSS 이미지가 보이지 않는 이유는 무엇입니까

답변

관련 문제