时间:2023-08-31 10:24:01 | 来源:网站运营
时间:2023-08-31 10:24:01 来源:网站运营
(web前端网页制作课作业)使用HTML+CSS制作非物质文化遗产专题网页设计与实现:@TOCDreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++
等任意html编辑软件进行运行及修改编辑等操作)。 其中: (1) html文件包含:其中index.html是首页、其他html为二级页面; (2) css文件包含:css全部页面样式,文字滚动, 图片放大等; (3) js文件包含:js实现动态轮播特效, 表单提交, 点击事件等等(个别网页中运用到js代码)。<!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" /><title>大学生心理测试网</title><link href="style/ys.css" rel="stylesheet" type="text/css" /></head><body style=" background:none"><div class="header"> <div class="mainbox"><h1>大学生心理测试网</h1></div></div><div class="bj"> <div class="mainbox"> <form> <div class="hydl"> <h1>用户登录<a href="index.html">返回首页</a></h1> <dl> <dd> <b>用户名</b> <input type="text" class="text"> </dd> <dd> <b>密码</b> <input type="text" class="text"> </dd> <dt> <input type="checkbox" name="hidden" value="1"> 记住我 </dt> <dd style="border:none; margin-top:inherit;"> <input type="submit" value="登录" class="sub"> </dd> </dl> </div> </form> </div></div></body></html>
*{padding:0px;margin:0px;}a{text-decoration:none;}a{text-decoration:none;}a:hover{text-decoration:none;}ul,li{list-style:none;}body{auto;font:12px "Microsoft YaHei", 微软雅黑,;background:#f5f5f5;}.clear{clear:both;}.main{background-color: #FFF;padding: 0; margin:10px auto;border: 1px solid #dcdcdc;width:860px;}.title{ width:100%; overflow:hidden; text-align:center; border-bottom:1px solid #dcdcdc; line-height:40px; color:#333; font-weight:bold; font-size:22px; background:#f0f9ff;}.wt{ width:840px; margin:0 auto; padding:20px 0;}.wt li{ width:100%; overflow:hidden;border-bottom:1px dashed #bcbcbc; padding-bottom:14px; margin-bottom:14px;}.wt h1{font-size: 16px;font-weight: bold; color: #dc5151; padding-bottom:10px;}.wt_d{padding:5px; width:100%; overflow:hidden; font-size:14px;}.wt_d input{ margin-right:6px;}.tj{ width:100%; overflow:hidden; padding-bottom:30px; text-align:center;}.button{ padding:2px 10px;}.tj a{ font-size:14px; padding:2px 10px;}.tj a:hover{ text-decoration:underline; color:#dc5151;}.mainbox{ width:1200px; margin:0 auto;}.header{ width:100%; overflow:hidden; padding:30px 0;}.header h1{ color:#333; font-weight:bold; font-size:24px;}.bj{ width:100%; overflow:hidden; height:700px; background:url(../images/bj.jpg) no-repeat; background-size:100%;}/*登录页面*/.dlwz{ font-size:16px; color:#999; line-height:70px;}.dlwz a{ font-size:16px; color:#333;}.dlwz a:hover{ color:#f60;}.login{ width:100%; overflow:hidden; height:600px; background:url(../images/login.jpg) center center no-repeat;}.hydl{ width:340px; padding:10px 25px 25px 25px; background:#fff; border-radius:4px; float:right; margin:110px 50px 0 0;}.hydl h1{ font-size:24px; color:#888; line-height:24px; padding:25px 0 10px; overflow:hidden; font-weight:normal;}.hydl h1 a{ float:right; color:#333; text-decoration:underline; font-size:16px; text-decoration:none;}.hydl h1 a:hover{ color:#f60;}.hydl dl{ width:100%; display:block;}.hydl dl dd{ display:block; line-height:40px; border:1px #e3e3e3 solid; border-radius:3px; height:40px; margin-top:20px;}.hydl dl dd input.text{ width:230px;float: right; overflow:hidden; border:none; height:40px;}.hydl dl dd input.text:focus{ outline:none;}.hydl dl dd b{ width:100px; text-indent:10px; border-right:1px #e3e3e3 solid; float:left; overflow:hidden; font-size:14px; color:#333; font-weight:normal;}.hydl dl dt{ line-height:60px; height:60px; overflow:hidden;}.hydl dl dd input.sub{ width:340px; line-height:46px; height:46px; border:none; background:#f60; border-radius:3px; color:#fff; font-size:16px;}.hydl h2{ text-align:right; line-height:40px; overflow:hidden; border-top:1px #e3e3e3 solid; clear:both; margin-top:50px; padding-top:10px;}.nl{ margin-top:4px; padding:4px;}
请 “ 点赞” “✍️评论” “ 收藏”
一键三连哦! 【 关注我| 获取更多源码 | 优质文章】
带您学习各种前端插件、3D炫酷效果、图片展示、文字效果、以及整站模板 、大学生毕业HTML模板 、期末大作业模板 、等! 「在这里有好多 前端 开发者,一起探讨 前端 Node 知识,互相学习」!关键词:遗产,文化,物质,专题,设计,实现,使用,作业