免费html5 css3大学生网页设计期末作业 网页制作作业成品

最新推荐文章于 2024-04-30 16:59:14 发布
最新推荐文章于 2024-04-30 16:59:14 发布
阅读量4.2k 收藏 24
点赞数 4
分类专栏： 免费网页设计作业 文章标签： html5 css3 html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_55819908/article/details/129166115
版权

html5 css3大学生网页设计期末作业 网页制作作业成品

布局技术：html5 css3

页面个数：6个

网页元素：图文 超链接 表单

效果图：

 目录如下：

 

 

<!DOCTYPE html>
<html lang="en">
<head>
  	<title>Home</title>
  	<meta charset="utf-8">
    <meta name="description" content="Your description">
    <meta name="keywords" content="Your keywords">
    <meta name="author" content="Your name">
    <link rel="stylesheet" href="css/style.css">
    <script src="js/jquery-1.7.1.min.js"></script>
    <script src="js/superfish.js"></script>
    <script src="js/jquery.easing.1.3.js"></script>
    <script src="js/tms-0.4.1.js"></script>
    <script src="js/slider.js"></script>
<!--[if lt IE 8]>
   <div style=' clear: both; text-align:center; position: relative;'>
     <a href="http://windows.microsoft.com/en-US/internet-explorer/products/ie/home?ocid=ie6_countdown_bannercode">
       <img src="http://storage.ie6countdown.com/assets/100/images/banners/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today." />
    </a>
  </div>
<![endif]-->
<!--[if lt IE 9]>
	<script src="js/html5.js"></script>
	<link rel="stylesheet" href="css/ie.css"> 
<![endif]-->
</head>
<body>
<div class="main-indents">
    <div class="main">
        <!-- Header -->
        <header>
            <h1 class="logo"><a href="home.html">Diving Club</a></h1>
            <nav>
                <ul class="sf-menu">
                    <li class="current"><a href="home.html">home</a></li>
                    <li><a href="about.html">About</a></li>
                    <li>
                        <a href="gallery.html">Gallery</a>
                        <ul>
                            <li><a href="#">Maecenas faucibus</a></li>
                            <li><a href="#">Fusce tincidunt</a></li>
                            <li>
                                <a href="#">tempor eros</a>
                                <ul>
                                    <li><a href="#">ut viverra</a></li>
                                    <li><a href="#">hendrerit mauris</a></li>
                                </ul>
                            </li>
                            <li><a href="#">mauris ut du</a></li>
                        </ul>
                    </li>
                    <li><a href="calendar.html">calendar</a></li>
                    <li><a href="members_info.html">Members Info</a></li>
                    <li><a href="contacts.html">contacts</a></li>
                </ul>
            </nav>
            <div class="clear"></div>
        </header>
        <!-- Slider -->
        <div class="mp-slider">
            <ul class="items">
                <li><img src="images/slide-1.jpg" alt="" /><div class="banner"><span class="row-1"><b>See</b> the Underwater World</span><span class="row-2">With Your Own <b>Eyes</b></span></div></li>
                <li><img src="images/slide-2.jpg" alt="" /><div class="banner"><span class="row-1"><b>All</b> the Beauty</span><span class="row-2">of the Deep <b>Sea</b></span></div></li>
                <li><img src="images/slide-3.jpg" alt="" /><div class="banner"><span class="row-1"><b>Find</b> the treasures</span><span class="row-2">of the water <b>World</b></span></div></li>
            </ul>
            <a href="#" class="mp-prev"></a>
            <a href="#" class="mp-next"></a>
        </div>
        <!-- Content -->
        <section id="content"><div class="ic"></div>
            <div class="container_12">
            	<article class="a1">
                	<div class="wrapper">
                        <img src="images/page1-img1.png" alt="" class="img-indent">
                        <div class="extra-wrap">
                            <h3>
                                <span class="welcome">Welcome</span>
                                TO THE WONDERFUL SEA WORLD
                            </h3>
                            <p class="p1">
                                <a href="http://blog.85biye.taobao.com/free-website-templates/">Click here</a> for more info about this free web templates created by 85biye.taobao.com. This website template is optimized for 1280X1024 screen resolution. It is also XHTML & CSS valid. The PSD source files of this template are available for free for the registered members of 85biye.taobao.com. Feel free to get them!
                            </p>
                        </div> 
                    </div>
                </article>
                <article class="content-box">
                	<h3 class="hp-1">Upcoming Events:</h3>
                    <div class="wrapper">
                    	<div class="col-1">
                        	<figure class="img-box">
                            	<img src="images/page1-img2.jpg" alt="">
                            </figure>
                            <h5><span>31</span> june</h5>
                            <p>
                            	Nam liber tempor cumuod soluta nobis eleifend option congue imperdiet doming id quod mazim placerat.
                            </p>
                        </div>
                        <div class="col-1">
                        	<figure class="img-box">
                            	<img src="images/page1-img3.jpg" alt="">
                            </figure>
                            <h5><span>21</span> july</h5>
                            <p>
                            	Lorem ipsum dolor amet, consectetuer adipiscing elitom nonummy nibh euismod tincidunt ut laoreet dolore magna.
                            </p>
                        </div>
                        <div class="col-2">
                        	<figure class="img-box">
                            	<img src="images/page1-img4.jpg" alt="">
                            </figure>
                            <h5><span>03</span> August</h5>
                            <p>
                            	Ut wisi enim ad minim veniam, quis nostrd exerci tation ullamcorper suscipit lobortis nisl ut aliquip.
                            </p>
                        </div>
                    </div>
                </article>
            </div>
        </section>
        <!-- Footer -->
        <footer>
            <div class="copyright">
                Popular free web templates <a href="http://www.websitetemplatesonline.com" target="_blank">at www.WebsiteTemplatesOnline.com</a>. <a href="http://www.getjoomlatemplatesfree.com/" title="Joomla Templates for Websites">GetJoomlaTemplatesFree.com</a> - free Joomla themes for websites.<br>Website Template designed by <a href="http://85biye.taobao.com" target="_blank" rel="nofollow">85biye.taobao.com</a>
            </div>
            <ul class="social-list">
            	<li><a href="#"><img src="images/soc-icon-1.png" alt=""></a></li>
                <li><a href="#"><img src="images/soc-icon-2.png" alt=""></a></li>
                <li><a href="#"><img src="images/soc-icon-3.png" alt=""></a></li>
            </ul>
        </footer>
    </div>
</div>
</body>
</html>

计算机程序设计老师
关注
  • 4
    点赞
  • 踩
  • 24
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
大学生静态网页设计期末作业源码前端静态网页大作业源码.zip
06-18
大学生静态网页设计期末作业源码前端静态网页大作业源码，使用的是原生的 html，css，js 代码，期末作业必过，高分必备。 大学生静态网页设计期末作业源码前端静态网页大作业源码，使用的是原生的 html，css，js 代码，期末作业必过，高分必备。大学生静态网页设计期末作业源码前端静态网页大作业源码，使用的是原生的 html，css，js 代码，期末作业必过，高分必备。大学生静态网页设计期末作业源码前端静态网页大作业源码，使用的是原生的 html，css，js 代码，期末作业必过，高分必备。大学生静态网页设计期末作业源码前端静态网页大作业源码，使用的是原生的 html，css，js 代码，期末作业必过，高分必备。大学生静态网页设计期末作业源码前端静态网页大作业源码，使用的是原生的 html，css，js 代码，期末作业必过，高分必备。大学生静态网页设计期末作业源码前端静态网页大作业源码，使用的是原生的 html，css，js 代码，期末作业必过，高分必备。
学生网页成品
03-05
学生网页成品，利用Dreamweaver和css布局技术，内容丰富完整！
HTML+CSS简单漫画网页设计成品 蜡笔小新3页 大学生个人HTML网页制作作品
网页设计与制作
03-17 732
1网页简介：此作品为学生个人主页网页设计题材，HTML+CSS 布局制作,web前端期末大作业,大学生网页设计作业源码，这是一个不错的网页制作，画面精明，代码为简单学生水平, 非常适合初学者学习使用。2.网页编辑等任意html编辑软件进行运行及修改编辑等操作）。3.知识应用：技术方面主要应用了网页知识中的: Div+CSS、鼠标滑过特效、Table、导航栏效果、Banner、表单、二级三级页面等，视频、 音频元素 、Flash，同时设计了Logo（源文件）所需的知识点。
2014大学生个人网页作业成品免费下载
04-28
我们分享了六份网页作业在这里，希望这里有你想要的成品，一般一个寝室刚好六人嘛，不够的话大伙就到表哥作业网来看看吧。 表哥作业网bgzuoye.com有网页成品和FLASH成品，博客栏目我们会分享在设计网页过程中遇到的问题或者经验。 特色： 只要你已经购买或者使用过里面的成品点击“我已购买”则会记录你的学校信息在我们的系统里，在“有谁购买”菜单会看到所有学校的列表，以防相同学校同一个班级的同学同时购买哈。 祝期末愉快！ —BG
学生dreamweaver网页设计作业成品-简单动漫网页设计
07-26
学生dreamweaver网页设计作业成品,采用html+css布局,是学习网页设计不错的案例和源代码,希望对大家有所帮助 作品介绍 小黄人网页设计 5页 无js 带视频带音频 非常好看, 非常适合大学生网页设计大作业, 学生dreamweaver网页设计作业成品,html静态页面源代码 静态网页制作代码【CSS+DIV】 此作品为学生个人主页网页设计题材，代码为简单学生水平 html+css 布局制作，作品下载后可使用任意HTML编辑软件（例如：DW、HBuilder、NotePAD, Vscode 所有编辑器均可使用） 网页作品布局方面：网页布局整体为LOGO、导航、轮播图、主体内容布局。子页面多种布局，兴趣爱好内容使用图片列表布局，成绩页面插入了表格，联系我们使用图片对齐方式设置了左对齐。 网页作品技术方面：使用CSS制作了网页背景图、鼠标经过及选中导航变色效果、下划线等。 首页制作了留言表单，同时简单使用JavaScript制作了表单判断（提交时表单不能为空） 空）
html+css网页设计源码(简洁)
12-25
html+css网页设计源码(简洁)，前端基础代码，拿来就用 评分: ⭐⭐⭐⭐⭐
学生个人网页制作成品
计算机毕业论文源码，学生个人网页制作html源码。贴近用户做网络推广和互联网优化。
02-21 4646
学生HTML个人网页作业作品， 校园网站网页设计成品， 学生网页设计作业源码。 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大？HTML网页作业无从下手？网页要求的总数量太多？没有合适的模板？等等一系列问题。你想要解决的问题，在这篇博文中基本都能满足你的需求~ 原始HTML+CSS+JS页面设计, web大学生网页设计作业源码，这是一个不错的网页制作，画面精明，非常适合初学者学习使用。学生个人网页制作成品给大家介绍下。 1.网页作品简介方面 ：HTML
HTML+CSS鲜花网页制作 DW静态网页设计 个人网页制作
html精品源码
05-13 3040
一、作品介绍 网页作品代码简单html+css，可使用任意HTML编辑软件（如：Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++ 等任意html编辑软件进行运行及修改编辑等操作）。 技术方面主要应用了学生网页课程中的: Div+CSS、鼠标滑过特效、Table、导航栏效果、Banner、表单、二级三级页面等，视频、 音频元素 、Flash，同时设计了Logo（源文件）所需的知识点。 文章目录一、作品介绍二、作品演示三、代码展示css
大学生个人网页设计 HTML个人网页制作 web个人网站模板 简单静态HTML个人网页作品
热门推荐
HTML网页设计
07-31 5万+
🧑个人网页设计、🙋‍♂️个人简历制作、👨‍💼简单静态HTML个人网页作品、👨‍🏭个人介绍网站模板 、等网站的设计与制作。⭐个人网页设计网站模板采用DIV CSS布局制作，网页作品有多个页面，如 :个人介绍（文字页面）、我的作品（图片列表）、个人技能（图文页面）、在线留言（表单页面）CSS样式方面网页整体采用左右布局结构，制作了网页背景图片，导航区域每个导航背景色不同，导航背景色与页面背景呼应。🏅 一套A+的网页应该包含 (具体可根据个人要求而定)📔网站布局方面：计划采用目前主流的、能兼容各大...
HTML期末大作业 ~ 凤阳智慧旅游官方旗舰店(我的家乡)网页设计作业成品(HTML+CSS+JavaScript)
七夕情人节表白网页代码100款 HTML5网页设计与制作1120款 Echarts大屏数据150款
06-30 6600
HTML期末大作业 ~ (我的家乡)大学生旅游网页设计作业成品 ~ HTML+CSS+JS网页设计期末课程大作业 ~ web前端开发技术 ~ web课程设计网页规划与设计 临近期末, 你还在为HTML网页设计结课作业,老师的作业要求感到头大？HTML网页作业无从下手？网页要求的总数量太多？没有合适的模板？等等一系列问题。你想要解决的问题，在这篇博文中基本都能满足你的需求~ 原始HTML+CSS+JS页面设计, web大学生网页设计作业源码，~这是一个不错的网页制作，画面精明，非常适合初学者学习使用。 作品介
大学生网页制作 大学校园简介5页作业 html网页设计 dw期末成品代码下载
07-12
页面精美小清新，包含div+css、图片、轮播图、JS滚动、Table布局、登录框，比较简单容易上手。 【大学生DW网页设计成品 大学校园简介静态HTML网页作业制作 dreamweaver网页作业代码下载】
大学生bootstrap网页制作 个人简介博客页面作业 html网页设计 dw期末成品代码下载
06-04
页面绿色主色调，包含div+css、图片列表、bootstrap自适应布局，无复杂JS特效，比较简单容易上手。 【大学生bootstrap网页制作 个人简介博客页面作业 html网页设计 dw期末成品代码下载 】
综艺节目介绍11页成品下载 大学生网页制作模板下载 html网页设计作业 dw期末成品代码下载
07-12
页面精美，包含div+css、图片、音乐、flash，比较简单容易上手。 【大学生DW网页设计成品 静态HTML网页作业制作 dreamweaver网页作业代码下载】
前端HTML5学习2（新增多媒体标签，H5的兼容性处理）
qq_51752841的博客
04-27 499
前端HTML5学习2（新增多媒体标签，H5的兼容性处理）
CSS3新增特性（二）
m0_48670609的博客
04-24 1205
接上一篇，CSS3新增特性，包括 2D 转换（位移、缩放、旋转、倾斜）和 3D 转换，以及动画。
CSS3（响应式布局）
l_al_al_a的博客
04-27 682
/只在x方向上重复。//只在y方向上重复。//前一个时间用于表示过渡效果持续时间，后一个时间用于表示过渡效果的延迟。# 和 #注意：其中angle对应单位为：deg。# 及 #
高德地图+HTML+点击事件+自定心信息窗体
最新发布
pursue.dreams的博客
04-30 211
【代码】高德地图+HTML+点击事件+自定心信息窗体。
html+css网页设计期末作业
12-12
以下是一个HTML+CSS网页设计期末作业的示例： ```html <!DOCTYPE html> <html> 网页设计期末作业 body { background-color: #f2f2f2; font-family: Arial, sans-serif; } header { background-...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值