个人制作的第二个页面-----NBA季后赛对阵图

经过上一个个人导航页面的写成之后，开始准备这第二个页面。把兴趣和工作结合起来，是最好方式。所以这次准备为自己关注的 NBA2015-2016赛季季后赛写一个页面。页面是模仿NBA中国官方网站的季后赛对阵专栏写的。
主要还是运用了DIV+CSS。在对各轮赛事对阵图的布局排列上花了一点时间来调试。
编写过程中遇到的问题： 1.在给各轮对战球队添加<a>超链接的时候，链接失效。后来发现原来【z-index标签会让<a>标签失效】，当DIV设置了z-index，而a没有设置，可能会出现DIV的z-index更高，z-index就是排列顺序，DIV已经在A标签上面，鼠标移上去后，它是DIV：hover，并不是A：hover了。

解决方法：调整它的z-index，或者把A：hover改成 div:hvoer a这样来实现hover也是可以的。由于这个页面层次不多，所以我直接取消了z-index，改用position标签完成任务。
2.给各支球队后面加文字队名的时候，文字和图片水平排列，但是没有做到上下居中。个人制作的第二个页面-----NBA季后赛对阵图
解决方法：采用标签vertical-align:middle; 使图片文字水平居中
最终页面成型：个人制作的第二个页面-----NBA季后赛对阵图
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <title>NBA2015-2016赛季季后赛</title>
    <style>
        body,h1,h2,h3,ul,ol,p,figure {
            margin: 0;
            padding: 0;
        }
        body {
            background-color: #fff;
            font-family: "Helvetica Neue",Helvetica,Arial,"Microsoft YaHei UI","Microsoft YaHei",SimHei,"宋体",SimSun,Sans-Serif;
        }
        ul,ol {
            list-style: outside none none;
        }
        a {
            text-decoration: none;
        }
        .none {
            display: none;
        }
        #header {
            width: 100%;
            min-width: 1263px;
            height: 70px;
            background-color: #333;
            box-shadow: 0 1px 10px rgba(0, 0, 0, 0.3);
            position: relative;
            z-index: 9999;
        }
        #header .center {
            width: 1263px;
            height: 70px;
            margin: 0 auto;
        }
        #header .logo {
            width: 230px;
            height: 70px;
            background-image: url(../img/logo.png);
            text-indent: -9999px;
            float: left;
        }
        #header .link {
            width: 650px;
            height: 70px;
            line-height: 70px;
            color: #eee;
            float: right;
        }
        #header .link li {
            width: 120px;
            text-align: center;
            float: right;
        }
        #header .link a {
            color: #eee;
            display: block;
        }
        #header .link a:hover,
        #header .active a {
            background-color: #000;
        }

        #headline {
            width: 100%;
            min-width: 1263px;
            height: 300px;
            background: linear-gradient(to right bottom, rgba(0,0,0,0.7), rgba(0,0,0,0)), url(../img/headline.jpg) no-repeat center;
        }
        #headline .center {
            width: 1263px;
            height: 300px;
            margin: 0 auto;
        }
        #headline hgroup{
            padding: 100px 0 0 50px;
        }
        #headline h2 {
            color: #eee;
            font-size: 36px;
            letter-spacing: 1px;
        }
        #headline h3 {
            color: #eee;
            font-size: 20px;
            letter-spacing: 1px;
        }
        #container {
            width: 1263px;
            margin: 30px auto;
        }

        #container .playoff{
            width: 900px;
            height: 800px;
            position: relative;
        }

        #container .playoff .background{
            margin-top: 50px;
        }

        #container .playoff .background img{
            width: 100%;
        }

        #container .playoff .POLOGO{
            position: absolute;
            left: 330px;
            top: 60px;
        }

        #container .playoff a:hover{
            color: red;
        }

        #container .playoff .round1{
            position: absolute;
            left: 25px;
            top: 85px;
        }

        #container .playoff .round1 img{
            width: 130px;
            height: 155px;
        }

        #container .playoff .round1 .west1{
            position: absolute;
            left: 10px;
            top: 5px;
        }

        #container .playoff .round1 .west1 img{
            width: 60px;
            height: 60px;
            vertical-align:middle;
        }

        #container .playoff .round1 .west2{
            position: absolute;
            left: 10px;
            top: 65px;
        }

        #container .playoff .round1 .west2 img{
            width: 60px;
            height: 50px;
            vertical-align:middle;
        }

        #container .playoff .round1 p{
            position: absolute;
            left: 20px;
            top: 120px;
        }

        #container .playoff .round2{
            position: absolute;
            left: 25px;
            top: 245px;
        }

        #container .playoff .round2 img{
            width: 130px;
            height: 155px;
        }

        #container .playoff .round2 .west3{
            position: absolute;
            left: 10px;
            top: 5px;
        }

        #container .playoff .round2 .west3 img{
            width: 60px;
            height: 60px;
            vertical-align:middle;
        }

        #container .playoff .round2 .west4{
            position: absolute;
            left: 10px;
            top: 65px;
        }

        #container .playoff .round2 .west4 img{
            width: 60px;
            height: 50px;
            vertical-align:middle;
        }

        #container .playoff .round2 p{
            position: absolute;
            left: 10px;
            top: 120px;
        }

        #container .playoff .round3{
            position: absolute;
            left: 25px;
            top: 420px;
        }

        #container .playoff .round3 img{
            width: 130px;
            height: 155px;
        }

        #container .playoff .round3 .west5{
            position: absolute;
            left: 10px;
            top: 5px;
        }

        #container .playoff .round3 .west5 img{
            width: 60px;
            height: 60px;
            vertical-align:middle;
        }

        #container .playoff .round3 .west6{
            position: absolute;
            left: 10px;
            top: 65px;
        }

        #container .playoff .round3 .west6 img{
            width: 60px;
            height: 50px;
            vertical-align:middle;
        }

        #container .playoff .round3 p{
            position: absolute;
            left: 10px;
            top: 120px;
        }

        #container .playoff .round4{
            position: absolute;
            left: 25px;
            top: 580px;
        }

        #container .playoff .round4 img{
            width: 130px;
            height: 155px;
        }

        #container .playoff .round4 .west7{
            position: absolute;
            left: 10px;
            top: 5px;
        }

        #container .playoff .round4 .west7 img{
            width: 60px;
            height: 60px;
            vertical-align:middle;
        }

        #container .playoff .round4 .west8{
            position: absolute;
            left: 10px;
            top: 65px;
        }

        #container .playoff .round4 .west8 img{
            width: 60px;
            height: 50px;
            vertical-align:middle;
        }

        #container .playoff .round4 p{
            position: absolute;
            left: 20px;
            top: 120px;
        }

        #container .playoff .round5{
            position: absolute;
            left: 178px;
            top: 160px;
        }

        #container .playoff .round5 img{
            width: 130px;
            height: 155px;
        }

        #container .playoff .round5 .west9{
            position: absolute;
            left: 10px;
            top: 5px;
        }

        #container .playoff .round5 .west9 img{
            width: 60px;
            height: 60px;
            vertical-align:middle;
        }

        #container .playoff .round5 .west10{
            position: absolute;
            left: 10px;
            top: 65px;
        }

        #container .playoff .round5 .west10 img{
            width: 60px;
            height: 50px;
            vertical-align:middle;
        }

        #container .playoff .round5 p{
            position: absolute;
            left: 20px;
            top: 120px;
        }

        #container .playoff .round6{
            position: absolute;
            left: 178px;
            top: 515px;
        }

        #container .playoff .round6 img{
            width: 130px;
            height: 155px;
        }

        #container .playoff .round6 .west11{
            position: absolute;
            left: 10px;
            top: 5px;
        }

        #container .playoff .round6 .west11 img{
            width: 60px;
            height: 60px;
            vertical-align:middle;
        }

        #container .playoff .round6 .west12{
            position: absolute;
            left: 10px;
            top: 65px;
        }

        #container .playoff .round6 .west12 img{
            width: 60px;
            height: 50px;
            vertical-align:middle;
        }

        #container .playoff .round6 p{
            position: absolute;
            left: 20px;
            top: 120px;
        }

        #container .playoff .round7{
            position: absolute;
            left: 240px;
            top: 335px;
        }

        #container .playoff .round7 img{
            width: 130px;
            height: 155px;
        }

        #container .playoff .round7 .west13{
            position: absolute;
            left: 10px;
            top: 5px;
        }

        #container .playoff .round7 .west13 img{
            width: 60px;
            height: 60px;
            vertical-align:middle;
        }

        #container .playoff .round7 .west14{
            position: absolute;
            left: 10px;
            top: 65px;
        }

        #container .playoff .round7 .west14 img{
            width: 60px;
            height: 50px;
            vertical-align:middle;
        }

        #container .playoff .round7 p{
            position: absolute;
            left: 20px;
            top: 120px;
        }

        #container .playoff .round8{
            position: absolute;
            left: 530px;
            top: 335px;
        }

        #container .playoff .round8 img{
            width: 130px;
            height: 155px;
        }

        #container .playoff .round8 .west15{
            position: absolute;
            left: 10px;
            top: 5px;
        }

        #container .playoff .round8 .west15 img{
            width: 60px;
            height: 60px;
            vertical-align:middle;
        }

        #container .playoff .round8 .west16{
            position: absolute;
            left: 10px;
            top: 65px;
        }

        #container .playoff .round8 .west16 img{
            width: 60px;
            height: 50px;
            vertical-align:middle;
        }

        #container .playoff .round8 p{
            position: absolute;
            left: 20px;
            top: 120px;
        }

        #container .playoff .round9{
            position: absolute;
            left: 593px;
            top: 160px;
        }

        #container .playoff .round9 img{
            width: 130px;
            height: 155px;
        }

        #container .playoff .round9 .west17{
            position: absolute;
            left: 10px;
            top: 5px;
        }

        #container .playoff .round9 .west17 img{
            width: 60px;
            height: 60px;
            vertical-align:middle;
        }

        #container .playoff .round9 .west18{
            position: absolute;
            left: 10px;
            top: 65px;
        }

        #container .playoff .round9 .west18 img{
            width: 60px;
            height: 50px;
            vertical-align:middle;
        }

        #container .playoff .round9 p{
            position: absolute;
            left: 20px;
            top: 120px;
        }

        #container .playoff .round10{
            position: absolute;
            left: 593px;
            top: 515px;
        }

        #container .playoff .round10 img{
            width: 130px;
            height: 155px;
        }

        #container .playoff .round10 .west19{
            position: absolute;
            left: 10px;
            top: 5px;
        }

        #container .playoff .round10 .west19 img{
            width: 60px;
            height: 60px;
            vertical-align:middle;
        }

        #container .playoff .round10 .west20{
            position: absolute;
            left: 10px;
            top: 65px;
        }

        #container .playoff .round10 .west20 img{
            width: 60px;
            height: 50px;
            vertical-align:middle;
        }

        #container .playoff .round10 p{
            position: absolute;
            left: 20px;
            top: 120px;
        }

        #container .playoff .round11{
            position: absolute;
            left: 745px;
            top: 85px;
        }

        #container .playoff .round11 img{
            width: 130px;
            height: 155px;
        }

        #container .playoff .round11 .west21{
            position: absolute;
            left: 10px;
            top: 5px;
        }

        #container .playoff .round11 .west21 img{
            width: 60px;
            height: 60px;
            vertical-align:middle;
        }

        #container .playoff .round11 .west22{
            position: absolute;
            left: 10px;
            top: 65px;
        }

        #container .playoff .round11 .west22 img{
            width: 60px;
            height: 50px;
            vertical-align:middle;
        }

        #container .playoff .round11 p{
            position: absolute;
            left: 20px;
            top: 120px;
        }

        #container .playoff .round12{
            position: absolute;
            left: 745px;
            top: 245px;
        }

        #container .playoff .round12 img{
            width: 130px;
            height: 155px;
        }

        #container .playoff .round12 .west23{
            position: absolute;
            left: 10px;
            top: 5px;
        }

        #container .playoff .round12 .west23 img{
            width: 60px;
            height: 60px;
            vertical-align:middle;
        }

        #container .playoff .round12 .west24{
            position: absolute;
            left: 10px;
            top: 65px;
        }

        #container .playoff .round12 .west24 img{
            width: 60px;
            height: 50px;
            vertical-align:middle;
        }

        #container .playoff .round12 p{
            position: absolute;
            left: 10px;
            top: 120px;
        }

        #container .playoff .round13{
            position: absolute;
            left: 745px;
            top: 420px;
        }

        #container .playoff .round13 img{
            width: 130px;
            height: 155px;
        }

        #container .playoff .round13 .west25{
            position: absolute;
            left: 10px;
            top: 5px;
        }

        #container .playoff .round13 .west25 img{
            width: 60px;
            height: 60px;
            vertical-align:middle;
        }

        #container .playoff .round13 .west26{
            position: absolute;
            left: 10px;
            top: 65px;
        }

        #container .playoff .round13 .west26 img{
            width: 60px;
            height: 50px;
            vertical-align:middle;
        }

        #container .playoff .round13 p{
            position: absolute;
            left: 10px;
            top: 120px;
        }

        #container .playoff .round14{
            position: absolute;
            left: 745px;
            top: 580px;
        }

        #container .playoff .round14 img{
            width: 130px;
            height: 155px;
        }

        #container .playoff .round14 .west27{
            position: absolute;
            left: 10px;
            top: 5px;
        }

        #container .playoff .round14 .west27 img{
            width: 60px;
            height: 60px;
            vertical-align:middle;
        }

        #container .playoff .round14 .west28{
            position: absolute;
            left: 10px;
            top: 65px;
        }

        #container .playoff .round14 .west28 img{
            width: 60px;
            height: 50px;
            vertical-align:middle;
        }

        #container .playoff .round14 p{
            position: absolute;
            left: 20px;
            top: 120px;
        }

        #container .playoff .round15{
            position: absolute;
            left: 386px;
            top: 255px;
        }

        #container .playoff .round15 img{
            width: 130px;
            height: 155px;
        }

        #container .playoff .round15 .west29{
            position: absolute;
            left: 10px;
            top: 5px;
        }

        #container .playoff .round15 .west29 img{
            width: 60px;
            height: 60px;
            vertical-align:middle;
        }

        #container .playoff .round15 .west30{
            position: absolute;
            left: 10px;
            top: 65px;
        }

        #container .playoff .round15 .west30 img{
            width: 60px;
            height: 50px;
            vertical-align:middle;
        }

        #container .playoff .round15 p{
            position: absolute;
            left: 20px;
            top: 120px;
        }

        #container {
            width: 1263px;
            margin: 30px auto;
        }
        #container .sidebar {
            width: 340px;
            float: right;
        }

        #container .sidebox{
            margin: 0 0 10px 0;
            text-align: center;
            border: 1px solid green;
        }

        #container .sidebox h2{
            font-size: 20px;
            font-weight: normal;
            letter-spacing: 1px;
            text-indent: 8px;
            height: 40px;
            line-height: 40px;
            background-color: #fafafa;
            color: #666;
            text-align: left;
        }

        #container .figure{
            padding: 10px 0;

        }

        #container figure img{
            width: 100%;
        }

        #container figure{
            display: inline-block;
            padding: 4px;
            color: #666;
            width: 70px;
            height: 70px;
            margin: 0 0 30px 0;
        }

        #container figure a:hover{
            color: #00A000;
        }

        #container .rule{
            line-height: 30px;
        }



        #footer {
            height: 360px;
            background-color: #222;
            clear: both;
            position: relative;
            top:20px;
        }
        #footer .top {
            width: 1263px;
            height: 281px;
            margin: 0 auto;
            text-align: center;
        }
        #footer .block {
            width: 410px;
            height: 280px;
            display: inline-block;
            text-align: left;
            color: #ccc;
            vertical-align: top;
        }
        #footer h2 {
            font-size: 24px;
            font-weight: normal;
            padding: 20px 0 0 20px;
        }
        #footer hr {
            width: 90%;
            border: 1px dashed #333;
        }
        #footer ul {
            font-size: 18px;
            color: #777;
            text-indent: 20px;
            line-height: 2;
        }

        #footer a{
            color: #777;
        }

        #footer a:hover{
            color: green;
        }

        #footer .bottom {
            height: 80px;
            line-height: 80px;
            text-align: center;
            color: #777;
            background-color: #000;
            border-top: 1px solid #444;
        }
    </style>
</head>
<body>

<header id="header">
    <div class="center">
        <h1 class="logo">NBA2015-2016赛季季后赛</h1>
        <nav class="link">
            <h2 class="none">网站导航</h2>
            <ul>
                <li><a href="tencent://message/uin=">启动QQ</a></li>
                <li><a href="https://wx.qq.com/" target="_blank">打开微信</a></li>
                <li><a href="http://weibo.com/" target="_blank">新浪微博</a></li>
            </ul>
        </nav>
    </div>
</header>

<div id="headline">
    <div class="center">
        <hgroup>
            <h2>季后赛对阵图</h2>
            <h3>各支球队对阵图，战绩排名等</h3>
        </hgroup>
    </div>
</div>

<div id="container">
    <aside class="sidebar">
        <div class="sidebox hot">
            <h2>西部</h2>
            <div class="figure">
                <figure>
                    <img src="img/western_logo.png" width="" height=""/><figcaption>西部</figcaption>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/warriors" target="_blank"><img src="img/勇士LOGO.png" width="" height=""/><figcaption>勇士</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/spurs" target="_blank"> <img src="img/马刺LOGO.png" width="" height=""/><figcaption>马刺</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/thunder" target="_blank"> <img src="img/雷霆LOGO.png" width="" height=""/><figcaption>雷霆</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/clippers" target="_blank"> <img src="img/快船LOGO.png" width="" height=""/><figcaption>快船</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/blazers" target="_blank"><img src="img/开拓者LOGO.png" width="" height=""/><figcaption>开拓者</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/mavericks" target="_blank"><img src="img/小牛LOGO.png" width="" height=""/><figcaption>小牛</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/grizzlies" target="_blank"><img src="img/灰熊LOGO.png" width="" height=""/><figcaption>灰熊</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/rockets" target="_blank"><img src="img/火箭LOGO.png" width="" height=""/><figcaption>火箭</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/jazz" target="_blank"><img src="img/爵士LOGO.png" width="" height=""/><figcaption>爵士</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/kings" target="_blank"><img src="img/国王LOGO.png" width="" height=""/><figcaption>国王</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/nuggets" target="_blank"><img src="img/掘金LOGO.png" width="" height=""/><figcaption>掘金</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/pelicans" target="_blank"><img src="img/鹈鹕LOGO.png" width="" height=""/><figcaption>鹈鹕</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/timberwolves" target="_blank"><img src="img/森林狼LOGO.png" width="" height=""/><figcaption>森林狼</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/suns" target="_blank"><img src="img/太阳LOGO.png" width="" height=""/><figcaption>太阳</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/lakers" target="_blank"><img src="img/湖人LOGO.png" width="" height=""/><figcaption>湖人</figcaption></a>
                </figure>
            </div>
        </div>
        <div class="sidebox hot">
            <h2>东部</h2>
            <div class="figure">
                <figure>
                    <img src="img/eastern_logo.png" width="" height=""/><figcaption>东部</figcaption>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/cavaliers" target="_blank"><img src="img/骑士LOGO.png" width="" height=""/><figcaption>骑士</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/raptors" target="_blank"> <img src="img/猛龙LOGO.png" width="" height=""/><figcaption>猛龙</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/heat" target="_blank"> <img src="img/热火LOGO.png" width="" height=""/><figcaption>热火</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/hawks" target="_blank"> <img src="img/老鹰LOGO.png" width="" height=""/><figcaption>老鹰</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/celtics" target="_blank"><img src="img/凯尔特人LOGO.png" width="" height=""/><figcaption>凯尔特人</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/hornets" target="_blank"><img src="img/黄蜂LOGO.png" width="" height=""/><figcaption>黄蜂</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/pacers" target="_blank"><img src="img/步行者LOGO.png" width="" height=""/><figcaption>步行者</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/pistons" target="_blank"><img src="img/活塞LOGO.png" width="" height=""/><figcaption>活塞</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/bulls" target="_blank"><img src="img/公牛LOGO.png" width="" height=""/><figcaption>公牛</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/wizards" target="_blank"><img src="img/奇才LOGO.png" width="" height=""/><figcaption>奇才</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/magic" target="_blank"><img src="img/魔术LOGO.png" width="" height=""/><figcaption>魔术</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/bucks" target="_blank"><img src="img/雄鹿LOGO.png" width="" height=""/><figcaption>雄鹿</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/knicks" target="_blank"><img src="img/尼克斯LOGO.png" width="" height=""/><figcaption>尼克斯</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/nets" target="_blank"><img src="img/篮网LOGO.png" width="" height=""/><figcaption>篮网</figcaption></a>
                </figure>
                <figure>
                    <a href="http://china.nba.com/teams/#!/sixers" target="_blank"><img src="img/76人LOGO.png" width="" height=""/><figcaption>76人</figcaption></a>
                </figure>
            </div>
        </div>
    </aside>
    <div class="playoff">
        <h2>2015-2016赛季NBA季后赛对阵图</h2>
        <hr/>
        <div class="background"><img src="img/季后赛对阵底图.png" width="" height=""/></div>
        <div class="POLOGO"><img src="img/POlogo.png"><br/>                 <a href="http://china.nba.com/playoffs/matchups/" target="_blank">系列赛对阵</a></div>
        <div class="round1">
            <img src="img/球队对阵底图.png" width="" height=""/>
            <div class="west1"><a href="http://china.nba.com/teams/#!/warriors" target="_blank"><img src="img/勇士LOGO.png" width="" height="" /> GSW</a></div>
            <div class="west2"><a href="http://china.nba.com/teams/#!/rockets" target="_blank"><img src="img/火箭LOGO.png" width="" height="" /> HOU</a></div>
            <p><a href="http://china.nba.com/playoffs/series/#!/1/5/2015" target="_blank"> 勇士4-1火箭</a></p>
        </div>
        <div class="round2">
            <img src="img/球队对阵底图.png" width="" height=""/>
            <div class="west3"><a href="http://china.nba.com/teams/#!/clippers" target="_blank"><img src="img/快船LOGO.png" width="" height="" /> LAC</a></div>
            <div class="west4"><a href="http://china.nba.com/teams/#!/blazers" target="_blank"><img src="img/开拓者LOGO.png" width="" height="" /> POR</a></div>
            <p><a href="http://china.nba.com/playoffs/series/#!/1/8/2015" target="_blank"> 开拓者4-2快船</a></p>
        </div>
        <div class="round3">
            <img src="img/球队对阵底图.png" width="" height=""/>
            <div class="west5"><a href="http://china.nba.com/teams/#!/spurs" target="_blank"><img src="img/马刺LOGO.png" width="" height="" /> SAS</a></div>
            <div class="west6"><a href="http://china.nba.com/teams/#!/grizzlies" target="_blank"><img src="img/灰熊LOGO.png" width="" height="" /> MEN</a></div>
            <p><a href="http://china.nba.com/playoffs/series/#!/1/6/2015" target="_blank"> 马刺4-0灰熊</a></p>
        </div>
        <div class="round4">
            <img src="img/球队对阵底图.png" width="" height=""/>
            <div class="west7"><a href="http://china.nba.com/teams/#!/thunder" target="_blank"><img src="img/雷霆LOGO.png" width="" height="" /> OKC</a></div>
            <div class="west8"><a href="http://china.nba.com/teams/#!/mavericks" target="_blank"><img src="img/小牛LOGO.png" width="" height="" /> DAL</a></div>
            <p><a href="http://china.nba.com/playoffs/series/#!/1/7/2015" target="_blank"> 雷霆4-1小牛</a></p>
        </div>
        <div class="round5">
            <img src="img/球队对阵底图.png" width="" height=""/>
            <div class="west9"><a href="http://china.nba.com/teams/#!/warriors"  target="_blank"><img src="img/勇士LOGO.png" width="" height="" /> GSW</a></div>
            <div class="west10"><a href="http://china.nba.com/teams/#!/blazers"  target="_blank"><img src="img/开拓者LOGO.png" width="" height="" /> POR</a></div>
            <p><a href="http://china.nba.com/playoffs/series/#!/2/3/2015" target="_blank"> 勇士4-1开拓者</a></p>
        </div>
        <div class="round6">
            <img src="img/球队对阵底图.png" width="" height=""/>
            <div class="west11"><a href="http://china.nba.com/teams/#!/thunder" target="_blank"><img src="img/马刺LOGO.png" width="" height="" /> OKC</a></div>
            <div class="west12"><a href="http://china.nba.com/teams/#!/spurs" target="_blank"><img src="img/雷霆LOGO.png" width="" height="" /> SAS</a></div>
            <p><a href="http://china.nba.com/playoffs/series/#!/2/4/2015" target="_blank"> 雷霆4-2马刺</a></p>
        </div>
        <div class="round7">
            <img src="img/球队对阵底图.png" width="" height=""/>
            <div class="west13"><a href="http://china.nba.com/teams/#!/warriors" target="_blank"><img src="img/勇士LOGO.png" width="" height="" /> GSW</a></div>
            <div class="west14"><a href="http://china.nba.com/teams/#!/thunder" target="_blank"><img src="img/雷霆LOGO.png" width="" height="" /> OKC</a></div>
            <p><a href="http://china.nba.com/playoffs/series/#!/3/2/2015" target="_blank"> 勇士4-3雷霆</a></p>
        </div>
        <div class="round8">
            <img src="img/球队对阵底图.png" width="" height=""/>
            <div class="west15"><a href="http://china.nba.com/teams/#!/cavaliers" target="_blank"><img src="img/骑士LOGO.png" width="" height="" /> CLE</a></div>
            <div class="west16"><a href="http://china.nba.com/teams/#!/raptors" target="_blank"><img src="img/猛龙LOGO.png" width="" height="" /> TOR</a></div>
            <p><a href="http://china.nba.com/playoffs/series/#!/3/1/2015" target="_blank"> 骑士4-2猛龙</a></p>
        </div>
        <div class="round9">
            <img src="img/球队对阵底图.png" width="" height=""/>
            <div class="west17"><a href="http://china.nba.com/teams/#!/cavaliers" target="_blank"><img src="img/骑士LOGO.png" width="" height="" /> CLE</a></div>
            <div class="west18"><a href="http://china.nba.com/teams/#!/hawks" target="_blank"><img src="img/老鹰LOGO.png" width="" height="" /> ATL</a></div>
            <p><a href="http://china.nba.com/playoffs/series/#!/2/1/2015" target="_blank"> 骑士4-0老鹰</a></p>
        </div>
        <div class="round10">
            <img src="img/球队对阵底图.png" width="" height=""/>
            <div class="west19"><a href="http://china.nba.com/teams/#!/raptors" target="_blank"><img src="img/猛龙LOGO.png" width="" height="" /> TOR</a></div>
            <div class="west20"><a href="http://china.nba.com/teams/#!/heat" target="_blank"><img src="img/热火LOGO.png" width="" height="" /> MIA</a></div>
            <p><a href="http://china.nba.com/playoffs/series/#!/2/2/2015" target="_blank"> 猛龙4-3热火</a></p>
        </div>
        <div class="round11">
            <img src="img/球队对阵底图.png" width="" height=""/>
            <div class="west21"><a href="http://china.nba.com/teams/#!/cavaliers" target="_blank"><img src="img/骑士LOGO.png" width="" height="" /> CLE</a></div>
            <div class="west22"><a href="http://china.nba.com/teams/#!/pistons" target="_blank"><img src="img/活塞LOGO.png" width="" height="" /> DET</a></div>
            <p><a href="http://china.nba.com/playoffs/series/#!/1/1/2015" target="_blank"> 骑士4-0活塞</a></p>
        </div>
        <div class="round12">
            <img src="img/球队对阵底图.png" width="" height=""/>
            <div class="west23"><a href="http://china.nba.com/teams/#!/hawks" target="_blank"><img src="img/老鹰LOGO.png" width="" height="" /> ATL</a></div>
            <div class="west24"><a href="http://china.nba.com/teams/#!/celtics" target="_blank"><img src="img/凯尔特人LOGO.png" width="" height="" /> BOS</a></div>
            <p><a href="http://china.nba.com/playoffs/series/#!/1/4/2015" target="_blank"> 老鹰4-2凯尔特人</a></p>
        </div>
        <div class="round13">
            <img src="img/球队对阵底图.png" width="" height=""/>
            <div class="west25"><a href="http://china.nba.com/teams/#!/raptors" target="_blank"><img src="img/猛龙LOGO.png" width="" height="" /> TOR</a></div>
            <div class="west26"><a href="http://china.nba.com/teams/#!/pacers" target="_blank"><img src="img/步行者LOGO.png" width="" height="" /> IND</a></div>
            <p><a href="http://china.nba.com/playoffs/series/#!/1/2/2015" target="_blank"> 猛龙4-3步行者</a></p>
        </div>
        <div class="round14">
            <img src="img/球队对阵底图.png" width="" height=""/>
            <div class="west27"><a href="http://china.nba.com/teams/#!/heat" target="_blank"><img src="img/热火LOGO.png" width="" height="" /> MIA</a></div>
            <div class="west28"><a href="http://china.nba.com/teams/#!/hornets" target="_blank"><img src="img/黄蜂LOGO.png" width="" height="" /> CHA</a></div>
            <p><a href="http://china.nba.com/playoffs/series/#!/1/3/2015" target="_blank"> 热火4-3黄蜂</a></p>
        </div>
        <div class="round15">
            <img src="img/球队对阵底图.png" width="" height=""/>
            <div class="west29"><a href="http://china.nba.com/teams/#!/warriors" target="_blank"><img src="img/勇士LOGO.png" width="" height="" /> GSW</a></div>
            <div class="west30"><a href="http://china.nba.com/teams/#!/cavaliers" target="_blank"><img src="img/骑士LOGO.png" width="" height="" /> CLE</a></div>
            <p><a href="http://china.nba.com/playoffs/series/#!/4/1/2015" target="_blank"> 勇士1-0骑士</a></p>
        </div>
    </div>
    <p class="rule">        季后赛采用七场四胜制，都采用2-2-1-1-1的主场分配方法，拥有四个主场的一方将会在第一、二、五（如果需要）、七（如果需要）场比赛坐镇主场，第三、四、六（如果需要）场则是征战客场。对阵双方的主场优势并非由种子排位的高低来决定，而是由双方在常规赛的成绩（胜率）来决定。因此，如果一个赛区冠军作为四号甚至三号种子，但是常规赛胜率在联盟中却排在五名之后，那么在首轮对阵五号种子或者六号种子的时候将有可能没有主场优势（比较双方成绩）。种子排位只决定球队在季后赛的走势。
        经过三轮的淘汰赛，获得东西部冠军的两支球队将进入最后的总决赛。总决赛（NBA Finals）一般在每年的6月进行，采用七场四胜2-3-2的赛制，双方成绩较佳者将获得第一、二、六（如果需要）、七（如果需要）场的主场权利，作为补偿，成绩较差者将获得第三、四、五（如果需要）连续三个主场的权利。系列赛由一方先赢得四场比赛就结束，获胜的球队将获得NBA总冠军。冠军球队将捧得拉里奥布莱恩杯，表现最出色的球员（一般是冠军队球员）将获颁总决赛MVP。每位冠军成员在赛后还会获得一枚总冠军戒指，上面刻有球队标志以及夺冠年份。 </p>
</div>

<footer id="footer">
    <div class="top">
        <div class="block left">
            <h2>合作伙伴</h2>
            <hr>
            <ul>
                <li><a href="http://bbs.hupu.com/" target="_blank">虎扑体育网</a></li>
                <li><a href="http://china.nba.com/" target="_blank">NBA中国官网</a></li>
                <li><a href="http://kbs.sports.qq.com/" target="_blank">腾讯赛事直播</a></li>
                <li><a href="http://www.jrszhibo.info/" target="_blank">JRS直播</a></li>
            </ul>
        </div>
        <div class="block center">
            <h2>体育门户</h2>
            <hr>
            <ul>
                <li><a href="http://sports.qq.com/" target="_blank">腾讯体育</a></li>
                <li><a href="http://www.lesports.com/" target="_blank">乐视体育</a> </li>
                <li><a href="http://sports.sina.com.cn/" target="_blank">新浪体育</a> </li>
                <li><a href="http://sports.sohu.com/" target="_blank">搜狐体育</a> </li>
                <li><a href="http://sports.163.com/" target="_blank">网易体育</a> </li>
            </ul>
        </div>
        <div class="block right">
            <h2>联系方式</h2>
            <hr>
            <ul>
                <li><a href="tencent://message/uin=543234285">QQ:543234285</a></li>
                <li><a href="mailto:543234285@qq.com"> 邮件：543234285@qq.com</a></li>
                <li>地址：浙江杭州下沙中国计量大学现代科技学院</li>
            </ul>
        </div>
    </div>
    <div class="bottom">Copyright © 于山阿金| 虎扑JR| 翻唱歌</div>
</footer>

</body>
</html>
顶: 0
踩: 0
源码搜藏网

首页 > 开发教程 > Web前端 >

个人制作的第二个页面-----NBA季后赛对阵图

创建时间：2016-06-06 11:11

相关内容

热门推荐
