Div id背景色不显示 - div id background color does not show

我想让"top2"分区的背景颜色为浅绿色。但是似乎css不起作用!"左"分割的单元格填充不起作用，因为我想让文本"在线讨论门户"垂直居中。

请帮助。

account.php

<?php
require 'connection.php';
session_start();
if(!isset($_SESSION['id'])) {
  header("location:login.php");
} else {
?>
<!doctype html>
<html>
<head>
  <title>welcome</title>
  <link href="acc.css" type="text/css" rel="stylesheet" media="all" />
  <style>
    table {
        table-layout:fixed;
        width:1030px;
    }
    body {
        background-image: url("border1.jpg"); 
        background-size:cover;
    }
  </style>
</head>
<body>
  <div id="top1">
      <div id="left">
          <h4> <center> <font color="green"> ONLINE DISCUSSION PORTAL </font> </center> </h4>
      </div>
      <div id="middle">
          </h4>
          <center> <i> <a href="notification.php" class="class1"> Notifications </a> </i> </center>
          </h4>
      </div>
      <div id="right">
          </h4>
          <center> <i> <a href="logout.php" class="class1"> Logout </a> </i> </center>
          </h4>
      </div>
  </div>
  <div id="top2">
      <table height="60px" width="1030px">
          <tr>
              <th> <u> <a href="forum.php" class="class2"> Forum </a> </u> </th>
              <th> <u> <a href="questions.php" class="class2"> My Questions </a> </u> </th>
              <th> <u> <a href="answerswers" class="class2"> My Answers </a> </u> </th>
          </tr>
      </table>
  </div>

  <div id="content">
      <h3> You are Logged in. </h3>
  </div>
</body>
</html>

<?php 
 }

CSS

acc.css A.class1 {
    color: green;
}
A.class1:link {
    text-decoration: none;
    color: green;
}
A.class1:visited {
    text-decoration: none;
    color: green;
}
A.class1:hover {
    text-decoration: underline;
    color: red;
}
A.class1:active {
    text-decoration: none;
    color: green;
}
A.class2 {
    color: white;
}
A.class2:link {
    text-decoration: none;
    color: white;
}
A.class2:visited {
    text-decoration: none;
    color: white;
}
A.class2:hover {
    text-decoration: underline;
    color: yellow;
}
A.class2:active {
    text-decoration: none;
    color: white;
}
#top1 {
    height: 40px;
    width: 1030px;
    border: 1px solid #008000;
    font-family: whimsy TT;
    margin: auto;
    margin-top: 50px;
}
#left {
    border: 1px solid #008000;
    height: 25px;
    width: 624px;
    float: left;
    margin: auto;
    color: 82b52f;
    padding-bottom: 15px;
}
#middle {
    border: 1px solid #008000;
    height: 32px;
    width: 200px;
    float: left;
    margin: auto;
    color: white;
    padding-top: 8px;
}
#right {
    border: 1px solid #008000;
    height: 32px;
    width: 200px;
    float: left;
    margin: auto;
    color: white;
    padding-top: 8px;
}
#top2 {
    background-color: 82b52f;
    height: 60px;
    width: 1030px;
    border: 1px solid #008000;
    font-family: whimsy TT;
    margin: auto;
    color: white;
}
#content {
    border: 1px solid #008000;
    height: 430px;
    width: 1030px;
    margin: auto;
}

color-background属性缺少#。所以应该是background-color:#82b52f要想左对齐，必须去掉<center>标签

您缺少颜色代码前的哈希符号#:

acc.css
A.class1 {color:green;}
A.class1:link  {text-decoration: none; color: green;}
A.class1:visited {text-decoration: none; color: green;}
A.class1:hover {text-decoration: underline; color: red;}
A.class1:active {text-decoration: none; color: green;}
A.class2 {color:white;}
A.class2:link {text-decoration: none; color: white;}
A.class2:visited {text-decoration: none; color: white;}
A.class2:hover {text-decoration: underline; color: yellow;}
A.class2:active {text-decoration: none; color: white;}
#top1
{
 height:40px; width:1030px; border:1px solid #008000; font-family:whimsy TT; margin:auto; margin-top:50px;
}
#left
{
border:1px solid #008000; height:25px; width:624px; float:left; margin:auto; color:82b52f; padding-bottom:15px;
}
#middle
{
border:1px solid #008000; height:32px; width:200px; float:left; margin:auto;  color:white; padding-top:8px;
}
#right
{
border:1px solid #008000; height:32px; width:200px; float:left; margin:auto; color:white; padding-top:8px;
}
#top2
{
background-color:#82b52f; height:60px; width:1030px; border:1px solid #008000; font-family:whimsy TT; margin:auto; color:white;
}
#content
{
	border:1px solid #008000; height:430px; width:1030px;  margin:auto; 
}

account.php
<?php
require 'connection.php';
?>
<?php
   
session_start();
 if(!isset($_SESSION['id']))
 {
	 header("location:login.php");
 }
 else
 {
	 ?>
<!doctype html>
<html>
<head>
<title>welcome</title>
<link href="acc.css" type="text/css" rel="stylesheet" media="all" />
<style>
table {
	table-layout:fixed;
	width:1030px;
}
body {
	background-image: url("border1.jpg"); 
	background-size:cover;
}
</style>
</head>
<body>
<div id="top1"> 
<div id="left">
  <h4> <center> <font color="green"> ONLINE DISCUSSION PORTAL </font> </center> </h4>
</div>
<div id="middle">
</h4> <center> <i> <a href="notification.php" class="class1"> Notifications </a> </i> </center> </h4>
</div> 
<div id="right">
</h4> <center> <i> <a href="logout.php" class="class1"> Logout </a> </i> </center> </h4>
</div>
</div>
<div id="top2"> 
  <table height="60px" width="1030px">
    <tr> 
      <th> <u> <a href="forum.php" class="class2"> Forum </a> </u> </th>
      <th> <u> <a href="questions.php" class="class2"> My Questions </a> </u> </th>
      <th> <u> <a href="answerswers" class="class2"> My Answers </a> </u> </th>
   </tr>
  </table> 
</div> 
<div id="content">
<h3> You are Logged in. </h3>
</div>
</body>
</html>
<?php 
	 
 }
?>