Web前端课程设计——个人主页

最新推荐文章于 2024-07-24 23:00:08 发布

aisebu7819

最新推荐文章于 2024-07-24 23:00:08 发布

阅读量1.1w

点赞数 17

文章标签：前端嵌入式 javascript ViewUI

原文链接：http://www.cnblogs.com/wenzhixin/p/10426120.html

版权

　　大三上学期期末总结，嗯，没错，是上学期，写在新学期开始hhh。

　　上学期学了一门HTML5+CSS3的课程，也叫Web前端技术，期末的课程设计是写一个个人主页，能够在浏览器中打开的静态网页。通过一学期的学习，虽然系统学习过一遍，但是综合起来实践还是有些难度的。不过很开心的是在我的不懈努力之下还是基本完成了。下面是设计要求和课程设计获取方式。

《Web前端技术实验》期末作品

——个人网站设计要求

主题：我是大学生

栏目：

自我介绍

我的大学

专业及课程

校园活动

室友

社团经历

获得奖项、证书

课外阅读

推荐的文章

要求：

内容积极向上，页面美观、布局合理，可参照教材第10章，加入部分图片、视频、动画等美化页面。

提交时间：第16周周五之前。

提交内容：以“学号姓名”命名网站文件夹，整体网站文件夹一起提交。

　　首先编写基本的网页框架，导航，头部，中间，尾部。然后根据选择器的命名不同，按照语法编写样式，调整大小和格局。最后使用jQuery插入动画播放照片，增加亮点。

　　百度网盘链接：https://pan.baidu.com/s/1MRKFAbg2TZ_1xbIsMNNsew

　　写在最后，这也是我学期末主要完成的作品，基本是边查边学边写的（作品劣质，大佬轻喷），这种一气呵成，畅快淋漓的感觉真的很爽。

　　网页效果图：

　　HTML代码：

  1 <!DOCTYPE HTML>
  2 <html>
  3 <head>
  4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  5 <title>个人网站-首页</title>
  6 <link rel="stylesheet" href="css/comm_style.css" type="text/css">
  7 
  8 <script src="slide/js/jquery-1.7.2.min.js" type="text/javascript"></script>
  9 <script src="slide/js/imgslide05.js" type="text/javascript"></script>
 10 <link rel="stylesheet" href="slide/css/picslide05.css" type="text/css" />
 11 
 12 <style type="text/css">
 13 #left{
     width: 180px;height: 362px;border: 1px solid #d9d7cb;margin: 10px; float: left;clear: left;}
 14 h4{
     letter-spacing: 1em;font-size: 15px;background: #e6e4db;height: 24px;border-bottom: 1px solid #d9d7cb;padding-top: 5px;
 15     margin-top:2px; padding-left: 10px;}
 16 #left h4{
     width: 170px;}
 17 #left ul{
     margin: 16px;line-height: 3em;}
 18 #left li{
     width: 150px</

最低0.47元/天解锁文章

aisebu7819

关注

17
点赞
踩
199

收藏

觉得还不错? 一键收藏
0
评论
Web前端课程设计——个人主页

　　大三上学期期末总结，嗯，没错，是上学期，写在新学期开始hhh。　　上学期学了一门HTML5+CSS3的课程，也叫Web前端技术，期末的课程设计是写一个个人主页，能够在浏览器中打开的静态网页。通过一学期的学习，虽然系统学习过一遍，但是综合起来实践还是有些难度的。不过很开心的是在我的不懈努力之下还是基本完成了。下面是设计要求和课程设计获取方式。《Web前端技术实验》期末作品—...
复制链接

扫一扫