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代码 学生网页课程设计期末作业下载 大学生网页设计制作成
  • 作品介绍
  • 一、作品演示
    • 1.首页
    • 2.最新资讯
    • 3.最爱的球队
    • 4.最爱的球星
    • 5. 联盟MVP
  • 二、代码目录
  • 三、代码实现
  • 四、web前端入门到高级(视频+源码+资料+面试)一整套 (教程)
  • 五、源码获取
  • 六、更多HTML期末大作业作品文章
  • 七、更多表白源码
  • 八、150套Echarts大数据可视化

1.首页

2.最新资讯

3.最爱的球队

4.最爱的球星

5. 联盟MVP

二、代码目录

三、代码实现
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3/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/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/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/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/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" 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>




四、web前端入门到高级(视频+源码+资料+面试)一整套 (教程)

web前端 零基础-入门到高级 (视频+源码+开发软件+学习资料+面试题) 一整套 (教程)
适合入门到高级的童鞋们入手~送1000套HTML+CSS+JavaScript模板网站


五、源码获取

❉ ~ 关注我,点赞博文~ 每天带你涨知识!

❉1.看到这里了就 [点赞+好评+收藏] 三连 支持下吧,你的「点赞,好评,收藏」是我创作的动力。

❉ 2.关注我 ~ 每天带你学习 :各种前端插件、3D炫酷效果、图片展示、文字效果、以及整站模板 、大学生毕业HTML模板 、期末大作业模板 、等! 「在这里有好多 前端 开发者,一起探讨 前端 Node 知识,互相学习」!

❉3.以上内容技术相关问题可以相互学习,可关注↓公Z号 获取更多源码 !

更多推荐

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