HTML5期末大作业：运动系列——NBA篮球主题学生网页设计(7个页面) HTML+CSS+JavaScript 体育网页设计HTML代码学生网页课程设计期末作业下载大学生网页设计制作成

临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大？HTML网页作业无从下手？网页要求的总数量太多？没有合适的模板？等等一系列问题。你想要解决的问题，在这篇博文中基本都能满足你的需求~

原始HTML+CSS+JS页面设计, web大学生网页设计作业源码，这是一个不错的网页制作，画面精明，非常适合初学者学习使用。

作品介绍

1.网页作品简介方面 ：球星，科比布菜恩特KOBE，勒布朗詹姆斯JAMES，罗斯ROSE，德壳诺维茨基，韦德WADE，姚明YAO HTML期末大学生网页设计作业 ,喜欢的可以下载，文章页支持手机PC响应式布局。主要有：首页最新资讯最爱的球队最爱的球星联盟MVP 总冠军球队作者介绍 等总共个页面html下载。

2.网页作品编辑方面：此作品为学生个人主页网页设计题材，代码为简单学生水平 html+css 布局制作，作品下载后可使用任意HTML编辑软件（例如：DW、HBuilder、NotePAD 、Vscode 、Sublime 、Webstorm 所有编辑器均可使用）

3.网页作品布局方面：网页布局整体为LOGO、导航、主体内容布局。子页面多种布局，兴趣爱好内容使用图片列表布局，成绩页面插入了表格，联系我们使用图片对齐方式设置了左对齐。

4.网页作品技术方面：使用CSS制作了网页背景图、鼠标经过及选中导航变色效果、下划线等。首页制作了留言表单，同时简单使用JavaScript制作了表单判断（提交时表单不能为空）

文章目录

HTML5期末大作业：运动系列——NBA篮球主题学生网页设计(7个页面) HTML+CSS+JavaScript 体育网页设计HTML代码学生网页课程设计期末作业下载大学生网页设计制作成
作品介绍
一、作品演示
二、代码目录
三、代码实现
四、web前端入门到高级(视频+源码+资料+面试)一整套 (教程)
五、源码获取
六、更多HTML期末大作业作品文章
七、更多表白源码
八、150套Echarts大数据可视化

一、作品演示

1.首页

在这里插入图片描述

2.最新资讯

在这里插入图片描述

3.最爱的球队

在这里插入图片描述

4.最爱的球星

在这里插入图片描述

5. 联盟MVP

在这里插入图片描述

二、代码目录

在这里插入图片描述

三、代码实现

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <!-- -->

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="keywords" />
    <meta name="description" content="我的网页nba">
    <link rel="stylesheet" type="text/css" href="images/style.css">

    <title>我爱NBA</title>
    <!-- -->
</head>

<body class="body1">
    <div id="getValues" value="index" style="display: none;"></div>
    <div id="getParams" value="a:0:{}" style="display: none;"></div>
    <!--top-->
    <div id="top">
        <div id="header">
            <div id="logo">
                <div id="MODBLK_222" class="mod_block media_image mb_logo_block">
                    <div class="flash_image">
                        <img src="images/logo.png" alt="" width="292" height="88">
                    </div>

                </div>
            </div>

            <!-- 站点语言模块Start -->
            <div class="switch_langbar" style="float: right; margin-top: 15px; margin-right: 15px;">
            </div>
            <!-- 站点语言模块End -->


            <div id="nav_bg">
                <div id="nav">
                    <div id="MODBLK_225" class="mod_block mb_56YrvV58_block">


                        <div class="nav_l"></div>
                        <ul id="nav_pMf9ZF" class="navigation">
                            <li>
                                <a href="index.htm">
    首页</a> </li>
                            <li>
                                <a href="news.html">
    最新资讯</a> </li>
                            <li>
                                <a href="teams.html">
    最爱的球队</a> </li>
                            <li class="">
                                <span id=""><a href="stars.html">
    最爱的球星</a>
    <ul style="display: none;">
        </ul></span>
                            </li>
                            <li>
                                <a href="mvp.html">
    联盟MVP</a> </li>
                            <li>
                                <a href="champion.html">
    总冠军球队</a> </li>
                            <li>
                                <a href="me.html">
    作者介绍</a> </li>
                        </ul>
                        <div class="nav_r"></div>

                    </div>
                </div>
            </div>
        </div>
    </div>


    <!--top end-->
    <!--main_div-->
    <div id="main_div">

        <!--web_bg-->
        <div class="web_bg">
            <!--mainmain-->
            <div id="main_all">
                <div id="mainmain">

                    <div id="banner_bg">
                        <div id="banner">
                            <div id="MODBLK_223" class="mod_block media_image mb_banner_block">
                                <div class="flash_image">

                                    <img src="images/002.jpg" alt="" width="940" height="326">
                                </div>


                            </div>
                        </div>
                    </div>
                    <div id="main_con" class="web_bg">

                        <!--移动图片start-->
                        <div id="use">
                            <div id="MODBLK_939" class="mod_block mb_i8swgeag_block">
                                <div id="marquee_demo5dNRXF" class="marquee_list">
                                    <table align="center" border="0" cellpadding="0" cellspacing="0">
                                        <tbody>
                                            <tr>
                                                <td id="marquee_product15dNRXF" valign="top">
                                                    <table width="100%" border="0" cellpadding="0" cellspacing="8" height="100">
                                                        <tbody>
                                                            <tr>
                                                                <td><a href="content/team_rehuo.html" title="热火"><img style="width: 160px; height: auto; padding: 3px 0px;" src="images/teams/rehuo.jpg" name="picautozoom" width="160" border="0" height="120"></a></td>
                                                                <td><a href="content/team_huren.html" title="湖人"><img style="width: 160px; height: auto; padding: 8px 0px;" src="images/teams/huren.jpg" name="picautozoom" width="160" border="0" height="120"></a></td>
                                                                <td><a href="content/team_huojian.html" title="火箭"><img style="width: 160px; height: auto; padding: 8px 0px;" src="images/teams/huojian.jpg" name="picautozoom" width="160" border="0" height="120"></a></td>
                                                                <td><a href="content/team_maci.html" title="马刺"><img style="width: 160px; height: auto; padding: 8px 0px;" src="images/teams/maci.jpg" name="picautozoom" width="160" border="0" height="120"></a></td>
                                                                <td><a href="#" title="凯尔特人"><img style="width: 160px; height: auto; padding: 8px 0px;" src="images/teams/kaierteren.jpg" name="picautozoom" width="160" border="0" height="120"></a></td>
                                                                <td><a href="#" title="爵士"><img style="width: 160px; height: auto; padding: 8px 0px;" src="images/teams/jueshi.jpg" name="picautozoom" width="160" border="0" height="120"></a></td>
                                                                <td><a href="#" title="篮网"><img style="width: aoto; height: 128; padding: 8px 0px;" src="images/teams/lanwang.jpg" name="picautozoom" width="160" border="0" height="120"></a></td>
                                                                <td><a href="content/team_xiaoniu.html" title="小牛队"><img style="width: 160px; height: auto; padding: 0px;" src="images/teams/sll.jpg" name="picautozoom" width="160" border="0" height="120"></a></td>

                                                            </tr>

                                                        </tbody>
                                                    </table>
                                                </td>
                                                <td id="marquee_product25dNRXF" valign="top">

                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                                <div class="list_bot"></div>
                                <script type="text/javascript">
                                    var speed = 20;
                                    var marquee_product25dNRXF = document.getElementById("marquee_product25dNRXF");
                                    var marquee_product15dNRXF = document.getElementById("marquee_product15dNRXF");
                                    var marquee_demo5dNRXF = document.getElementById("marquee_demo5dNRXF");
                                    marquee_product25dNRXF.innerHTML = marquee_product15dNRXF.innerHTML;

                                    function Marquee5dNRXF() {
                                        if (marquee_demo5dNRXF.scrollLeft >= marquee_product15dNRXF.scrollWidth) {
                                            marquee_demo5dNRXF.scrollLeft = 0;
                                        } else {
                                            marquee_demo5dNRXF.scrollLeft++;
                                        }
                                    }
                                    var MyMar5dNRXF = setInterval(Marquee5dNRXF, speed);
                                    marquee_demo5dNRXF.onmouseover = function() {
                                        clearInterval(MyMar5dNRXF);
                                    }
                                    marquee_demo5dNRXF.onmouseout = function() {
                                        MyMar5dNRXF = setInterval(Marquee5dNRXF, speed);
                                    }
                                </script>

                            </div>
                        </div>
                        <!--s移动图片over-->
                        <div id="main_01">
                            <div id="i_left">
                                <div id="MODBLK_914" class="mod_block mb_aSlzIyVD_block">
                                    <h3 class="blk_t">球 星</h3>


                                    <div class="list_main category">
                                        <div class="prod_type">
                                            <div id="pro_type_l7bBq1">
                                                <ul>
                                                    <li>
                                                        <a href="content/star_kobe.html">
    科比布莱恩特KOBE</a>
                                                    </li>
                                                    <li>
                                                        <a href="content/star_james.html">
    勒布朗詹姆斯JAMES</a>
                                                    </li>
                                                    <li>
                                                        <a href="content/star_rose.html">
    罗斯ROSE</a>
                                                    </li>
                                                    <li>
                                                        <a href="content/star_nuoweiciji.html">
    德克-诺维茨基</a>
                                                    </li>
                                                    <li>
                                                        <a href="content/star_weide.html">
    韦德WADE</a>
                                                    </li>
                                                    <li>
                                                        <a href="content/star_yaoming.html">
    姚明YAO</a>
                                                    </li>
                                                    <div class="blankbar1"></div>
                                                </ul>
                                            </div>
                                        </div>
                                        <div class="list_bot"></div>
                                    </div>
                                    <div class="blankbar"></div>


                                </div>
                                <div id="MODBLK_916" class="mod_block mb_03Kj95bK_block">
                                    <h3 class="blk_t">最爱球队</h3>
                                    <div align="center"><a href="content/team_huren.html"><img src="images/teams/huren.jpg" alt="湖人"  border="0"></a></div>
                                    <div class="blankbar"></div>

                                </div>
                            </div>
                            <div id="center">
                                <div id="MODBLK_943" class="mod_block mb_IjQGfuRD_block">
                                    <h3 class="blk_t">2011 NBA</h3>
                                    <div class="list_con company_intro">
                                        <p><img src="images/indexnews.jpg" alt="" width="350" height="260" align="left" style="margin-right: 10px;" />&nbsp;&nbsp;&nbsp;&nbsp; 6月12日，小牛队球员诺维茨基（中）手捧奖杯与球队成员们庆祝。当日，在NBA总决赛第六场中，达拉斯小牛队客场以105比95战胜迈阿密热火队，从而以4比2的总比分在NBA总冠军榜上第一次写上了小牛队的名字。

                                        </p>
                                        <div class=""><br />
                                        </div>
                                    </div>
                                    <div class="list_bot"></div>
                                </div>
                            </div>
                            <div id="i_right">
                                <div id="MODBLK_940" class="mod_block mb_jKadXmvB_block">
                                    <h3 class="blk_t">最新资讯</h3>
                                    <div class="list_main">
                                        <div class="list_con">
                                            <ul class="titlelist">
                                                <li>
                                                    <div align="center"><a href="content/news_01.html">美媒再谈小牛赢在团战</a><a href="http://qiche11a36.site3.sitestar.cn/qiche11a36/wwwroot/index.php?_m=mod_article&amp;_a=article_content&amp;article_id=87" title="最新资讯"></a>…</div>
                                                </li>
                                                <li>
                                                    <div align="center"><a href="content/news_02.html">波什解释哭泣原因：篮</a><a href="http://qiche11a36.site3.sitestar.cn/qiche11a36/wwwroot/index.php?_m=mod_article&amp;_a=article_content&amp;article_id=73" title="最新资讯"></a>…</div>
                                                </li>
                                                <li>
                                                    <div align="center"><a href="content/news_03.html">冲冠失利韦德在家禁闭</a><a href="http://qiche11a36.site3.sitestar.cn/qiche11a36/wwwroot/index.php?_m=mod_article&amp;_a=article_content&amp;article_id=88" title="最新资讯”"></a>…</div>
                                                </li>
                                                <li>
                                                    <div align="center"><a href="content/news_04.html">斯帅：热火教练组全部</a><a href="http://qiche11a36.site3.sitestar.cn/qiche11a36/wwwroot/index.php?_m=mod_article&amp;_a=article_content&amp;article_id=74" title="最新资讯"></a>…</div>
                                                </li>
                                            </ul>
                                            <div class="list_more"><a href="#"><img src="images/more_37.jpg" width="32" border="0" height="9"></a></div>

                                        </div>
                                        <div class="list_bot"></div>
                                    </div>
                                    <div class="blankbar"></div>
                                </div>
                                <div id="MODBLK_944" class="mod_block mb_t7gWwKCa_block">
                                    <h3 class="blk_t">最爱球星</h3>

                                    <div class="newprod">
                                        <div class="newprod_top"></div>
                                        <div class="newprod_con">


                                            <div class="pro_over">
                                                <table class="media_grid" width="100%" cellspacing="4">
                                                    <tbody>
                                                        <tr>
                                                            <td>
                                                                <div align="center"><a href="content/star_kobe.html"><img src="images/stars/kobe.jpg" height="200" align="absMiddle" border="0"></a></a>
                                                                </div>
                                                            </td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                        <div class="list_bot"></div>
                                    </div>
                                    <div class="blankbar"></div>



                                </div>

                            </div>
                        </div>



                        <div class="blankbar"></div>
                    </div>

                    <div id="footer_bg">

                        <!-- 页脚 -->
                        <div id="footer">
                            <div class="copyright">
                                <style type="text/css">
                                    .mb_foot_block {
                                        position: relative;
                                    }

                                    .mb_foot_block a {
                                        display: inline;
                                    }
                                </style>
                                <div id="MODBLK_224" class="mod_block mb_foot_block">
                                    <div class="com_con">版权所有 <a href="http://zuoye8.com" target="_blank">网页作业</a>
                                        <br>
                                    </div>
                                    <div class="list_bot"></div>
                                </div>
                            </div>
                        </div>

                        <script type="text/javascript" language="javascript">
                            <!--
                            $.ajaxSetup({
                                timeout: 300000
                            });
                            //-->
                        </script>
                        <!--  -->
                    </div>

                </div>
            </div>

        </div>

    </div>