🌩️ 精彩专栏推荐👇🏻👇🏻👇🏻
💂 作者主页: 【进入主页—🚀获取更多源码】
🎓 web前端期末大作业: 【📚HTML5网页期末作业 (1000套) 】
🧡 程序员有趣的告白方式:【💌HTML七夕情人节表白网页制作 (110套) 】
二、📚网站介绍
📔网站布局方面:计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。
📓网站程序方面:计划采用最新的网页编程语言HTML5+CSS3+JS程序语言完成网站的功能设计。并确保网站代码兼容目前市面上所有的主流浏览器,已达到打开后就能即时看到网站的效果。
📘网站素材方面:计划收集各大平台好看的图片素材,并精挑细选适合网页风格的图片,然后使用PS做出适合网页尺寸的图片。
📒网站文件方面:网站系统文件种类包含:html网页结构文件、css网页样式文件、js网页特效文件、images网页图片文件;
📙网页编辑方面:网页作品代码简单,可使用任意HTML编辑软件(如:Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++
等任意html编辑软件进行运行及修改编辑等操作)。
其中:
(1)📜html文件包含:其中index.html是首页、其他html为二级页面;
(2)📑 css文件包含:css全部页面样式,文字滚动, 图片放大等;
(3)📄 js文件包含:js实现动态轮播特效, 表单提交, 点击事件等等(个别网页中运用到js代码)。
三、🔗网站效果
▶️1.视频演示
A39JP 电影小黄人6页带js,包含视频,包含轮播图,包含 table 表格,表单,form input 输入框
🧩 2.图片演示
四、💒 网站代码
🧱HTML结构代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="keywords" content="tzyh">
<title>同名电影</title>
<style type="text/css">
<!--
-->
</style></head>
<body style="background:#eee;">
<table border="0" cellpadding="0" cellspacing="0" style="margin:auto; width:980px;">
<tr>
<td colspan="2"><img src="picture/banner_02.jpg"></td>
</tr>
<tr>
<td colspan="2" height="48" background="picture/nav_03.jpg">
<table width="980" height="48" border="0" style="margin-top:-12px;">
<tr>
<td align="center" valign="middle"><a href="index.html" style=" color:#000; text-decoration:none;">黄人介绍</a></td>
<td align="center" valign="middle"><a href="about.html" style=" color:#000; text-decoration:none;">人物简介</a></td>
<td align="center" valign="middle"><a href="shen.html" style=" color:#000; text-decoration:none;">身份揭秘</a> </td>
<td align="center" valign="middle"><a href="zuo.html" style=" color:#000; text-decoration:none;">图片欣赏</a></td>
<td align="center" valign="middle"><a href="" style=" color:#000; text-decoration:none;">同名电影</a></td>
<td align="center" valign="middle"><a href="ly.html" style=" color:#000; text-decoration:none;">在线留言</a></td>
</tr>
</table></td>
</tr>
</table>
<table width="960" border="0" style="background:#5d9de2; margin:auto;">
<tr>
<td width="487" align="left" valign="top" style="padding-left:30px; line-height:26px; font-size:18px;">片名:小黄人<br>
导演:凯尔·巴尔达 皮艾尔·柯芬 <br>
主演:桑德拉·布洛克 / 皮艾尔·柯芬 / 克里斯·雷纳德<br>
类型:动画 /家庭 / 喜剧<br>
国家/地区:美国<br>
对白语言:英语<br>
发行公司:Universal Pictures International<br>
上映日期:2015年7月10日</td>
<td width="463" style="padding-right:20px;"><img src="picture/tmdy_01.jpg"><br><br></td>
</tr>
</table>
<table border="0" cellspacing="0" cellpadding="0" style="height:600PX; width:960PX; margin:0 auto; background:#5d9de2;">
<tr>
<td><div align="center">
<embed src="file/shipin.mp4" width="800" height="451">
</div></td>
</tr>
</table>
<table width="980" border="0" style="margin:auto;">
<tr>
<td align="center" valign="top"><p style="color:#868686; font-size:12px; font-family:'新宋体'; font-weight:100;">小黄人网站 </p></td>
</tr>
</table>
</body>
</html>
🏠CSS样式代码
body,td,th {
font-family: 微软雅黑;
font-size: 14px;
font-weight: bold;
color: #FFF;
}
a:visited {
color: #000;
text-decoration:underline;
}
a:hover {
color: #000;
text-decoration:underline;
}
五、🎁更多源码
1.如果我的博客对你有帮助 请 “👍点赞” “✍️评论” “💙收藏”
一键三连哦!
2.💗【👇🏻👇🏻👇🏻🉑关注我| 获取更多源码】
带您学习各种前端插件、3D炫酷效果、图片展示、文字效果、以及整站模板 、大学生毕业HTML模板 、等!
📣以上内容技术相关问题💌欢迎一起交流学习👇🏻👇🏻👇🏻