Question

我想要＆＃39; top2＆＃39;的背景颜色。分裂为浅绿色。但似乎css不起作用！左边的单元格填充＆＃39;部门没有工作，因为我想要文本＆＃39;在线讨论门户＆＃39;垂直居中。

请帮忙。

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="answers" 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;
}

Answer 1

你错过＃为color-background属性。所以它应该是background-color:#82b52f 要对齐左侧，您必须删除<center>标记。

Answer 2

您在颜色代码前缺少哈希符号#：

＆＃13;

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; 
}

＆＃13;

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="answers" class="class2"> My Answers </a> </u> </th>
   </tr>
  </table> 
</div> 


<div id="content">

<h3> You are Logged in. </h3>
</div>

</body>
</html>


<?php 
	 
 }

?>

＆＃13;

div id背景颜色不显示

2 个答案: