下面介绍一下我的个人小网站吧，我的网站背景稍微单调一点白色，主要个人比较喜欢白色了，布局上面使用div+css,在整个页面设计上，主要体现我个人的爱好，对于我自己的介绍。首先在网上收集了一些图片，然后利用Dreamweaver强大的功能，将每一张图片都放到了合适的位置。
首先是首页的设计，在这里当然布局好了，显的整个网站看上去也舒服很多。首页分为头，身体，和footer，在头上面我插入了一张简单的漫画图片，别看图片简单，可是在网上找这样一张图片不是很简单啊。
其次就是导航的设计了，在这里分为首页，简单介绍，个人相册，还有联系方式。
中间放了一张图片。比较简单，在其他页面也用到了js特效。弄了一个小时钟。
在做这个特效的时候，也查了不少资料啊，虽然比较简单吧，但是还是比较费时，费力的，对于我这个菜鸟来说。
总结来说，做网页看的简单，做起来还出现了不少问题。
文章目录
- HTML期末大作业~ 个人网页6页面带下拉特效~简单带表格带设计说明 ~学生网页设计作业源码
- 作品介绍
- 一、作品演示
-
- 1.首页
- 2.介绍
- 3.相册
- 4.留言板
- 二、代码目录
- 三、代码实现
- 四、web前端入门到高级(视频+源码+资料+面试)一整套 (教程)
- 五、源码获取
- 六、更多HTML期末大作业作品文章
- 七、更多表白源码
- 八、150套Echarts大数据可视化
1.首页
2.介绍
3.相册
4.留言板
二、代码目录 三、代码实现
<!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=gb2312" />
<link rel="stylesheet" type="text/css" href="style.css" />
<title> </title>
<style>
</style>
</head>
<body onload=startclock()>
<div id="banner">
<div class="logo">我的个人主页</div>
</div>
<div id="nav">
<div id="date">
<form name="clock">
<!--clock start-->
<script language="JavaScript">
var timerID = null;
var timerRunning = false;
function stopclock() {
if (timerRunning)
clearTimeout(timerID);
timerRunning = false;
}
function startclock() {
stopclock();
showtime();
}
function showtime() {
var now = new Date();
var hours = now.getHours();
var minutes = now.getMinutes();
var seconds = now.getSeconds()
var timeValue = now.getYear() + "年" + (now.getMonth() + 1) + "月" + now.getDate() + "日" + ((hours >= 12) ? " 下午 " : " 上午 ")
timeValue += ((hours > 12) ? hours - 12 : hours)
timeValue += ((minutes < 10) ? ":0" : ":") + minutes
timeValue += ((seconds < 10) ? ":0" : ":") + seconds
document.clock.thetime.value = timeValue;
timerID = setTimeout("showtime()", 1000);
timerRunning = true;
}
</script>
<input name="thetime" style="" size="28" type="text"></form>
<!--clock end-->
</div>
<ul id="menu">
<li><a href="index.html">首页</a></li>
<li><a href="#">简单介绍</a>
<ul>
<li><a href="me.html">作者介绍</a></li>
<li><a href="webinfo.html">网站介绍</a></li>
</ul>
</li>
<li><a href="#">个人相册</a>
<ul>
<li><a href="photo.html">我的照片</a></li>
<li><a href="#">班级相册</a></li>
<li><a href="#">风景图片</a></li>
</ul>
</li>
<li><a href="contact.html">联系方式</a>
</li>
</ul>
</div>
<div id="main">
<div class="index-wel">
<div class="index-pic"><a href="me.html"><img src="images/wel.gif" alt="我" /></a></div>
</div>
</div>
<div id="footer">
<div class="copy"><a href="webinfo.html">网站介绍</a> | <a href="me.html">自我介绍</a> | <a href="photo.html">个人相册</a> | <a href="contact.html">联系方式</a><br /> 学校
<br />Copyright 2012 XXZ All Right Served.</div>
</div>
</body>
</html>
四、web前端入门到高级(视频+源码+资料+面试)一整套 (教程)
web前端 零基础-入门到高级 (视频+源码+开发软件+学习资料+面试题) 一整套 (教程)
适合入门到高级的童鞋们入手~送1000套HTML+CSS+JavaScript模板网站
五、源码获取
❉ ~ 关注我，点赞博文~ 每天带你涨知识!
❉1.看到这里了就 [点赞+好评+收藏] 三连 支持下吧，你的「点赞，好评，收藏」是我创作的动力。
❉ 2.关注我 ~ 每天带你学习 :各种前端插件、3D炫酷效果、图片展示、文字效果、以及整站模板 、大学生毕业HTML模板 、期末大作业模板 、等! 「在这里有好多 前端 开发者，一起探讨 前端 Node 知识，互相学习」！
❉3.以上内容技术相关问题可以相互学习，可关注↓公Z号 获取更多源码 !
更多推荐
个人HTML期末大作业~ 个人网页(HTML+CSS)6页面带下拉特效~简单带表格带设计说明 ~学生网页设计作业源码...
发布评论