Question

这让我很难过。我在它工作之前已经完成了，现在它不会。

导航栏后面的浅色背景也应位于页面正文的后面。页脚不应该在其中。页面上会有更多内容，但标题是欢迎来到Herb Place应该具有与导航栏相同的浅色背景。即使我在html中写了<div id="content-scroll">，div部分也会出现红色，甚至无法识别它。

body {
  background-attachment:	fixed;
  background-image:		url("../photos/background.jpg");
  background-position:		center center;
  background-repeat:		repeat;
  background-size:		100%;
  font-family:			"open Sans", sans-serif;
  font-size-size:		medium;
  font-style:			normal;
  line-height:			1.6em;
  margin:			1px auto auto;
  text-align:			left;
  max-width:			1024px;
}
	
#navigation li {
  list-style: 			none;
  display:			block;
  float: 			left;
  margin: 			1em;
}

#navigation li a {
  display: 			block;
  text-decoration: 		none;
  color:			#006600;
  font-size: 			1.6em;
  font-family:			Lucida Console;
  font-style:			italic;
  margin: 			0.5em;
}

#navigation li a:hover {
  margin-top: 			2px;
  color:			yellow;
}

.rectangle {
  height: 			62px;
  position: 			relative;
  -moz-box-shadow: 		0px 0px 4px rgba(0,0,0,0.55);
  box-shadow: 			0px 0px 4px rgba(0,0,0,0.55);
  -webkit-border-radius: 	1px;
  -moz-border-radius: 		1px;
  border-radius: 		1px;
  z-index: 			300; /* the stack order: foreground */
  margin: 			1em 0;
  background-image:		url("../photos/background2.jpg");
}

#content-scroll  {
  background-image:		url("../photos/background2.jpg");
  max-width:			1024px;
  background-position:		center center;
  background-size:		100%;
}

h1 {
  color:			#669933;
  font-family:			kristen ITC;
  padding:			20px;
  text-align:			center center;
}

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>The Herb Place</title>
  <link href="html/herb.css" rel="stylesheet">
  
</head>  
<body>
  <header>
    <img id="logo" src="photos/logo.jpg"  alt="My logo">
  
  <!-- the body -->
    <div class="rectangle">
 <!-- the navigation links -->
      <ul id="navigation">
        <li><a href="Index.html"> HOME</a></li>
        <li><a href="html/about.html"> ABOUT US</a></li>
        <li><a href="html/store.html"> STORE</a></li>
        <li><a href="html/tips.html"> TIPS & HINTS</a></li>
        <li><a href="html/contact.html"> CONTACT US</a></li>
      </ul>
    </div>
  </header
  <div id="content-scroll">
  
      <h1> Welcome to The Herb Place</h1>
    
  </div>      
    <div id="footer">
    This website has been created as part of an assignment in an approval course of study for Curtin University and contains copyright<br>
    material not created by the author.  All copyright material used remains copyright of the respective owners and has been used here<br>
    pursuant to Section 40 of the Copyright Act 1968 (Commonwealth of Australia).  No part of this work may be reproduced without<br>
    consent if the original copyright owners.
    </div>  
    
</body>
</html>

侧边栏中的下拉菜单

0 个答案: