2-9 作业下划线居中table嵌套table为什么不能贴在一块（黑色的背景和图片）

<!DOCTYPE html>

<html>

<head>

*{margin: 0;padding: 0}

.header{

width: 100%;

height: 50px;

background-color: #07cbc9;

}

.header .title{

height: 50px;

width: 40%;

line-height: 50px;

font-size: 30px;

color: white;

float: left;

}

.about{width: 100%;margin: 0 auto;}

.about-title{font-size: 30px;margin: 0 auto;text-align: center;padding-top: 20px;font-style: thick;padding-bottom: 20px;}

.about-bottom-top{

height:50px;width:500px;margin-top: 30px;text-align: center;margin: 0 auto;}

.about-bottom-top p{margin-top:10px;}

.about-bottom-bottom{width: 100%;height: 300px;background-image: url(images/bb3.jpg) ; background-position: center center;background-repeat: no-repeat;background-size: 400px 250px;}

.abb2l{width: 250px;height: 300px;position: absolute;top:599px;left: 15%;padding: 20px;}

.abb2l p{padding: 5px;}

.pb{border: 1px solid #ececec;background-color: transparent;}

.exp{width: 80px;height: 30px;background-color: black;color: white;text-align: center;border: none;margin: 10px;}

.abb2r{float: right;text-align: center;}

.abb2rt,.abb2rb{width: 200px;height: 100px;margin-bottom: 20px;border:1px solid #07cbc9;margin-right: 100px;margin-top: 30px;line-height: 50px;}

.abb2rt,.abb2rb h2{font: 900;}

.gall{width: 1400px;margin: 0 auto;height: 620px;}

.ttd{height: 300px;width: 350px;text-align: center;}

.ttd img{width: 100%;height: 100%;background-color: #07cbc9;}

.ttdc{height: 100%;width: 100%;background-color: #07cbc9;}

.ttd h1{color: white;text-align: left; padding:20px; }

.ttdc1{color: white;text-align: left;padding-left:30px;padding-right:20px;line-height: 1.3em;font-size: 14px;font-weight: 200px }

.ttdc3{color:#d0d0d0;font-size: 10px;padding: 30px;text-align: left;}

.gallery{margin: 0 auto;width: 100%;}

.gallery-title{text-align: center;height: 40px;width: 100%}

.galp{width: 400px;height: 50px;margin: 0 auto;color:#989898;font-size: 12px;text-align: center;}

.gallery-content{width: 920px;margin: 0 auto;}

.g{width: 300px;height: 300px;}

.gg img{width: 300px;height: 200px;}

.ggg{width: 300px;height: 50px;background-color: black;color: white;border: none;}

.footer{width: 100%;height: 50px;background-color: #07cbc9;color:#F8F8F8;font-size: 10px;text-align: center;line-height: 50px;font-weight: 100}

</style>

</head>

<body>

<div class="about-title">ABOUT</div><hr>

<p>Lorem Ipsum is simply dummy text of the printing and typesting indesty.Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p>

</div>

<h1>A WORD<br>ABOUT US</h1>

<p>Lorem Ipsum is simply dummy text of the printing and typesting indesty.Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p><br>

</div>

<div class="abb2rt"><h2>70000</h2>Stuents</div>

<div class="abb2rb"><h2>600</h2>Faculty</div>

</div>

<table>

<tr>

<h1>Library</h1>

<p class="ttdc1">Lorem Ipsum is simply dummy tet of the printing and typesetteing industry</p>

<p class="ttdc3"> Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,when an unknown printer took a gallary of type and ascambled it to make a type apecimen book.</p>

</div>

</td>

<h1>Computer Lab</h1>

<p class="ttdc1">Lorem Ipsum is simply dummy tet of the printing and typesetteing industry</p>

<p class="ttdc3">Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,when an unknown printer took a gallary of type and ascambled it to make a type apecimen book.</p>

</div></td>

</tr>

<h1>Conference Hall</h1>

<p class="ttdc1">Lorem Ipsum is simply dummy tet of the printing and typesetteing industry</p>

<p class="ttdc3">Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,when an unknown printer took a gallary of type and ascambled it to make a type apecimen book.</p>

</div></td>

<h1>Play Ground</h1>

<p class="ttdc1">Lorem Ipsum is simply dummy tet of the printing and typesetteing industry</p>

<p class="ttdc3">Lorem Ipsum has been the industry's standard dummy text ever since the 1500s,when an unknown printer took a gallary of type and ascambled it to make a type apecimen book.</p>

</div></td>

</tr>

</table>

</div>

<h1>GALLERY</h1>

</div>

<p>Lorem Ipsum is simply dummy text of the printing and typesting indesty.Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p>

</div>

<tr>

<table>

<tr><td class="ggg">SCIENCE LAB</td></tr>

</table>

</td>

<tr><td class="ggg">INDOOR STATIUM</td></tr>

</table></td>

<tr><td class="ggg">TRANSPORTANTION</td></tr>

</table></td>

</tr>

<tr>