Web前端开发技术实验与实践（第3版）储久良编著实训3

实训3 超链接与多媒体文件应用

项目10 设计简易灯箱画廊
页面效果截图

代码

<!--prj_3_1.html-->
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>简易灯箱画廊设计</title><style type="text/css">body {text-align: center;}.div1 {width: 900px;height: 500px;margin: 0 auto;text-align: center;background-color: #33cc99;}ul {margin: 0 auto;width: 800px;list-style-type: none;height: 120px;}li {float: left;width: 110px;height: 90px;margin: 5px;}img {border: 0;width: 100px;height: 80px;}h3 {font-size: 24px;color: white;padding: 10px auto;}a {color: #ffffff;text-decoration: none;}a:link,a:visited,a:active {color: #0033cc;}a:hover {border-bottom: 4px solid #ff0000;}</style></head><body><embed src="../img/Sleep%20Away.mp3" loop="true" autostart="true" width="0" height="0"></embed><div id="" class="div1"><h3>简易灯箱画廊设计</h3><hr color="red"><ul><li><a href="../img/t1.jpg" target="iframe">T1<br /><img src="../img/t1.jpg" /></li><li><a href="../img/t2.jpg" target="iframe">T2<br /><img src="../img/t2.jpg" /></li><li><a href="../img/t3.jpg" target="iframe">T3<br /><img src="../img/t3.jpg" /></li><li><a href="../img/t4.jpg" target="iframe">T4<br /><img src="../img/t4.jpg" /></li><li><a href="../img/t5.jpg" target="iframe">T5<br /><img src="../img/t5.jpg" /></li><li><a href="../img/t6.jpg" target="iframe">T6<br /><img src="../img/t6.jpg" /></li><li><a href="../img/t7.jpg" target="iframe"></ul><iframe name="iframe" src="../img/t1.jpg" width="500px" height="300px" frameborder="0"></iframe></div></body>
</html>

项目11 设计支持音频、视频播放的网页
页面效果截图（我用的谷歌浏览器，要在浏览器设置下的隐私设置与安全性中的网站设置的Flash由禁止改为先询问）

代码

<!--prj_3_2.html-->
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title><style type="text/css">body {text-align: center;}ul {list-style-type: none;}li {float: left;margin: 20px;}div {height: 250px;background-color: #99cc00;text-align: center;}marquee {font-size: 16px;padding: 4px auto;}</style></head><body><h2>明月几时有</h2><hr><font size="4" color="" face="隶书">明月几时有？把酒问青天。<br>不知天上宫阙，今夕是何年。<br>我欲乘风归去，又恐琼楼玉宇，<br>高处不胜寒，起舞弄清影，何似在人间。 <br>转朱阁，抵绮户，照无眠。<br>不应有恨，何事偏向别时圆。 <br>人有悲欢离合，月有阴晴圆缺，此事古难全。 <br>但愿人长久，千里共婵娟。<br></font><div id=""><ul><li><embed src="../img/62.swf" loop="true" autostart="true" width="200px" height="200px"></embed></li><li><embed src="../img/蔡琴明月几时有.mp3" loop="true" autostart="true" width="200px" height="200px"></embed></li><li><embed src="../img/0303.swf" loop="true" autostart="true" width="200px" height="200px"></embed></li></ul></div><marquee direction="left" behavior="alternate" onmouseover="this.stop()" onmouseout="this.start()">欢迎来到我的多媒体世界！</marquee></body>
</html>

项目12 设计简易导航网站
页面效果截图

代码

<!--prj_3_3.html-->
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>网站导航</title><style type="text/css">ul {list-style-type: none;text-align: center;}li {float: left;width: 110px;display: inline;}li a {padding: 0 20px;}div {text-align: center;}</style></head><body><div id=""><p align="left">使用段落标记和超链接实现网站导航</p><p><a href="http://www.baidu.com/">百度</a>&nbsp;&nbsp;&nbsp;&nbsp;<a href="http://www.sina.com.cn/">新浪</a>&nbsp;&nbsp;&nbsp;&nbsp;<a href="http://www.qq.com/">腾讯</a>&nbsp;&nbsp;&nbsp;&nbsp;<a href="http://www.sohu.com/">搜狐</a>&nbsp;&nbsp;&nbsp;&nbsp;<a href="http://www.163.com/">网易</a>&nbsp;&nbsp;&nbsp;&nbsp;<a href="http://www.google.com.hk/">360搜索</a></p><hr align="center" size="3" color="#0066ff"><p align="left">利用无序列表实现水平导航条</p><ul><li><a href="http://www.baidu.com/">百度</a></li><li><a href="http://www.sina.com.cn/">新浪</a></li><li><a href="http://www.qq.com/">腾讯</a></li><li><a href="http://www.sohu.com/">搜狐</a></li><li><a href="http://www.163.com/">网易</a></li><li><a href="http://www.google.com.hk/">360搜索</a></li></ul></div></body>
</html>

项目13 设计专业课程导航
页面效果截图

代码

<!--prj_3_4.html-->
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>专业课程导航</title></head><body><h2 align="center">专业课程导航</h2><a name="dir0">专业课程导航</a><ul><li><a href="#dir1">英语</a></li><li><a href="#dir2">高数</a></li><li><a href="#dir3">大学物理</a></li></ul><h3><a name="dir1">英语</a></h3><p>基础英语、高级英语、报刊选读、视听、口语、英语写作、翻译理论与实践、语言理论、语言学概论、主要英语国家文学史及文学作品选读、主要英语国家国情等。<strong><a href="#dir0">返回</a></strong></p><h3><a name="dir2">高数</a></h3><p>《高等数学》课程介绍随着科学技术的迅猛发展，数学正日益成为各学科进行科学研究的重要手段和工具。高等数学是近代数学的基础，是理科各专业和经济管理专业类学生的必修课，也是在现代科学技术、经济管理、人文科学中应用最广泛的一门课程。因此学好这门课程对学生今后的发展是至关重要的。本课程是学生进入大学后学习的第一门重要的数学基础课。通过本课程的教学，使学生掌握处理数学问题的思想和方法，培养学生科学思维能力，同时为后续课程的学习奠定良好的基础。<strong><ahref="#dir0">返回</a></strong></p><h3><a name="dir3">大学物理</a></h3><p>以物理学基础为内容的大学物理课程，是理工科各专业学生一门重要的通识性的必修基础课。大学物理课程既为学生打好必要的物理基础，又在培养学生科学的世界观，增强学生分析问题和解决问题的能力，培养学生的探索精神、创新意识等方面，具有其他课程不能替代的重要作用。<strong><ahref="#dir0">返回</a></strong></p></body>
</html>

Web前端开发技术实验与实践（第3版）储久良编著实训3相关推荐

web前端开发技术实验与实践（第三版）储久良编著项目12 设计简易网站导航
web前端开发技术实验与实践(第三版)储久良编著项目12 设计简易网站导航实训三项目12 设计简易网站导航一.页面文字素材: 序号网站名称 URL 1 百度 http://www.ba ...
web前端开发技术实验与实践（第三版）储久良编著项目16 div+CSS页面布局设计
web前端开发技术实验与实践(第三版)储久良编著项目16 实训五项目16 一.页面文字素材: 这是头部信息区. 这是导航信息区. 这是主题信息区. 这是右侧信息区. 这是版权信息区. 二.代码: ...
web前端开发技术实验与实践（第三版）储久良编著项目13 设计新生课程简介
web前端开发技术实验与实践(第三版)储久良编著项目13 设计新生课程简介实训三项目13 设计新生课程简介一.页面文字素材: 英语基础英语.高级英语.报刊选读.视听.口语.英语写作.翻译 ...
web前端开发技术实验与实践（第三版）储久良编著项目5 综合编程岗位介绍
实训一项目5 综合编程岗位介绍一.页面文字素材: WEB前端开发工程师的岗位职责:(1)协助系统架构设计师进行系统架构设计工作:(2)承担WEB前端核心模块的设计.实现工作:(3)承担主要开发工作 ...
Web前端开发技术实验与实践（第3版）储久良编著实训8
实训8 HTML5基础与CSS3应用项目22 当当网企业用户注册页面设计页面效果截图代码  <!DOCTYPE html> < ...
web前端开发技术实验与实践（第三版）储久良编著项目8 设计制度宣传展板
实训二项目8 设计制度宣传展板一.页面文字素材: 大型仪器必须有专人保管,须配有稳压电源,使用前须先检查仪器间各电路连接情况,再开稳压电源,然后再启动仪器开关. 必须严格执行仪器设备运行记录制度, ...
Web前端开发技术实验与实践代码（第三版）储久良
实训七表单页面设计项目21 设计大学生暑假社会实践调查问卷页面设计大学生暑假社会实践调查问卷页面结果截图 HTML代码结果截图 HTML代码 <!-- prj_7_2.html --& ...
Web前端开发技术实验与实践（第3版）储久良编著实训7
实训7 表单页面设计项目20 设计科技工作者建言页面页面效果截图代码  <!DOCTYPE html> <html>&l ...
Web前端开发技术实验与实践（第3版）储久良编著实训6
实训6 表格与表格页面布局项目18 设计网络主题研讨会日程表页面效果截图代码  <!DOCTYPE html> <html&g ...
Web前端开发技术实验与实践（第3版）储久良编著实训2
项目6 文本与段落标记应用页面效果截图代码  <!DOCTYPE html> <html><head><me ...

Web前端开发技术实验与实践（第3版）储久良编著实训3

实训3 超链接与多媒体文件应用

Web前端开发技术实验与实践（第3版）储久良编著实训3相关推荐

最新文章

热门文章