2012-04-08 4 views
2

Итак, я сделал фоновое изображение, это всего лишь два цветных столбца для соответствия моему заголовку и навигационной панели. Я просто хочу, чтобы он повторялся горизонтально, но не появлялся. Heres, который показывает мои файлы и изображение: 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; 
} 
+2

Не могли бы вы предоставить ссылку на страницу «test», чтобы мы могли видеть, какие изображения вы используете? а не url (images/background.gif)? Или попробуйте www.jsfiddle.net => поместите код в верхнем левом поле и css в верхнем правом углу, затем нажмите CTRL + ENTER –

+0

Кстати, какое программное обеспечение u здесь используется? Мне кажется интересным :) – Asif

ответ

5

Если только изображение каталога является подкаталог CSS, вам нужно использовать

url(../images/background.gif) 

, потому что расположение относительно файла CSS.

Также, как правило, необходимо оставить пробел между селектором и «{», то есть body {, а не body{.

+0

Когда я помещаю папку изображений в папку css, она работает сейчас, но как мне ссылаться на нее относительно папки css, поэтому мне не нужно помещать папку изображений в папку css? – mharris7190

+0

Nevermind, я понял, что вы буквально предназначались для меня, чтобы набирать два периода ex: (../images/background.gif), поскольку два периода дают мне резервную копию уровня иерархии папок. БОЛЬШОЕ СПАСИБО! – mharris7190

4

Форы что вы держите его в http://example.com/images/background.gif. Ваша таблица стилей говорит, что она находится в http://example.com/css/images/background.gif, поэтому вы получаете ошибку 404.

+0

СПАСИБО ВАМ ТАК! Это то, что я делаю, я думаю, потому что, когда я помещаю свою папку изображений в свою папку css, она работает сейчас. Но как я могу ссылаться на папку вне css из url (...), поэтому мне не нужно помещать туда свою папку с изображениями? – mharris7190

0

Я не совсем понимаю, зачем вам нужен атрибут width для тела. Но проблема может быть в вашем URL-адресе. Я полагаю, что это может быть «/images/background.gif». Если вы поместите «images/background.gif», он укажет css/images/background.gif.

Смежные вопросы