简体   繁体   中英

Style - background-image not showing

Can someone please tell me why my background-image isn't showing up? This is my style.css layout? I've tried numerous codes but for some reason the image just won't show up. Please help me, it's for a project.

<style>

.body {
  background-image: url('http://i58.tinypic.com/2ngegih.png'); 
  background-repeat: repeat-y;
  background-position: left top;
  font-family: arial;
  font-size: 10pt;
}


#heading {
  text-align: center;

}

#left {
  float: left;
  padding: 0px 10px 0px 0px;
  width: 200px;
}

#middle {
  top: 10px;
  margin-left: 100px;
  margin-right: 700px;
  width: 810px;



}

#right {
  float: right;
  padding: 0px 10px 0px 10px;
  width: 90px;
}
 <style>

This is my header page:

<div id="heading">
<div class="heading">

<title>MediaBuzz</title>
<center><img src="http://i59.tinypic.com/vdjsqx.jpg">
</center>
</div></div>

This is the index page. All these pages are all I've got since I just started.

<?php
include('header.php');
?>

<div id="left">
<div class="left">
this is the left column
</div></div>


<div id="middle">
<div class="middle">

this is the middle column 
</div></div>

</style>
</div>
  • You don't need a period for selecting the body element. Not sure if you're using body as a class name. Please post the rest of the HTML page.
  • That url points to an HTML page but not the raw image itself. Try using http://oi58.tinypic.com/2ngegih.jpg

Edit:

That is invalid HTML.

The body element or class does not exist, and so your CSS declaration will not be applied. You need to learn the basic structure of an HTML page. Make use of the W3C Validator: http://validator.w3.org/

You also need a PHP server running to interpret the PHP code in there.

The following code should answer your question:

<!DOCTYPE html>
<html>
<head>
<title>MediaBuzz</title>
<style>
    html {
        height: 100%;
        width: 100%;
    }
body  {
    height: 100%;
    width: 100%;
    background-image: url("http://oi58.tinypic.com/2ngegih.jpg");
}
</style>
</head>
<body>

<!-- the rest of the HTML goes in here -->

</body>
</html>

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM