第二次网页设计实验报告（设计性实验）（表格+表单）
2024-05-20 06:01:40
第一个：
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>产品介绍</title><style>* {margin: 0;padding: 0;}table.main {width: 80%;margin: 10px auto;border: 1px solid black;border-collapse: collapse;}table.main td {border: 1px solid black;}table.main tr.caption td.picture {background: url(041.jpg) no-repeat center;background-size: cover;width: 200px;}table.main tr.caption td {background-color: #ffffcf;}table.main tr.caption td table.caption-right {padding: 20px;}table.main tr.caption td table.caption-right caption {text-align: left;margin-left: 10px;font-size: 1.5em;font-weight: 600;color: #b05b29;}table.main tr.caption td table.caption-right tr td {border: none;color: #333029;}table.main tr.section {background-color: #ffd9b4;}table.main tr.section td {font-size: 1.3em;font-weight: 500;color: #a24211;padding: 10px;}table.main tr.section-content td table tr th {color: #929292;letter-spacing: 1.1em;}table.main tr.section-content td table tr td {border: none;}</style>
</head><body><!-- <img src="03.jpg" alt=""> --><table class="main"><tr class="caption"><td class="picture"><img src="041.jpg" alt=""></td><td><table class="caption-right"><caption>产品名称：佳能 IXUS 130</caption><tr><td> 佳能 IXUS 130 (官方标配)</td></tr><tr><td> 松下原装SD卡2G (高速正品)</td></tr><tr><td> 佳能IXUS系列专用皮包</td></tr><tr><td> 索尼2.7英寸LCD保护贴(防刮/高透光/静电吸附)</td></tr><tr><td> 摄影指南</td></tr></table></td></tr><tr class="section"><td colspan="2">功能参数 </td></tr><tr class="section-content"><td colspan="2"><table><tr><th>音频功能</th><td>: 支持音频格式:MP3,WMA,WAV/内置麦克风,支持LINEIN寻录/收音功能/内置喇叭 </td></tr><tr><th>录音格式</th><td>: 44.1KHz, 128 Kbps, MP3, 支持MIC/LINE-IN直录 </td></tr><tr><th>附加功能</th><td>: 支持图片格式:JPEG(EXIF2.1)/电子书浏览/多语言(中/英)设置 </td></tr></table></td></tr><tr class="section"><td colspan="2">其它参数 </td></tr><tr class="section-content"><td colspan="2"><table><tr><th>接口</th><td>: USB接口,AV OUT接口, AV IN接口 </td></tr><tr><th>扩展卡</th><td>: 可扩充2G SD,MMC卡 </td></tr><tr><th>电池</th><td>: 内置锂电池 </td></tr><tr><th>尺寸</th><td>: 105.2 x47.6x15.6mm </td></tr><tr><th>重量</th><td>: 90g </td></tr></table></td></tr><tr class="section"><td colspan="2">主要参数</td></tr><tr class="section-content"><td colspan="2"><table><tr><th>型号</th><td>: PMP 169B</td></tr><tr><th>内存容量</th><td>: 512M</td></tr><tr><th>屏幕尺寸</th><td>: 2.12英寸 (最佳视觉比例16：9的宽屏)</td></tr><tr><th>屏幕特性</th><td>: LTPS TFT (720x240) </td></tr><tr><th>视频功能</th><td>: 支持ASF格式的MPG4,或通过软件转换成ASF播放,播放效果:320×420, 30fps/视频输出,输入/电视节目定时录制。</td></tr></table></td></tr></table>
</body></html>
第二个：
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>留言簿</title><style>table {border-collapse: collapse;}table tr {background-color: cornsilk;}table tr th {border: 1px solid #000;text-align: center;background-color: blanchedalmond;}table tr td {border: 1px solid #000;}table tr td span {color: red;}table tr.button {text-align: center;}table tr.button input {margin: 20px;}</style>
</head><body><form action="post"><table><tr><th colspan="2">留言簿</th></tr><tr><td>您的姓名：</td><td><input type="name" required placeholder="帅哥/美女"><span>*</span></td></tr><tr><td>您的邮箱：</td><td><input type="email" name="email" id="email" required><span>*</span></td></tr><tr><td>您的网站：</td><td><input type="text" placeholder="http://"></td></tr><tr><td>其他联系方式</td><td><input type="text" required><span>*</span></td></tr><tr><td>留言内容：<br><span>(200字以内)</span></td><td><textarea name="textarea" id="textarea" cols="60" rows="5"></textarea></td></tr><tr><td>请选择表情：</td><td><label for="face1"><img src="./face/face1.gif" alt=""></label><input type="radio" name="emotion" id="face1" checked><label for="face2"><img src="./face/face2.gif" alt=""></label><input type="radio" name="emotion" id="face2"><label for="face3"><img src="./face/face3.gif" alt=""></label><input type="radio" name="emotion" id="face3"><label for="face4"><img src="./face/face4.gif" alt=""></label><input type="radio" name="emotion" id="face4"><label for="face5"><img src="./face/face5.gif" alt=""></label><input type="radio" name="emotion" id="face5"><label for="face6"><img src="./face/face6.gif" alt=""></label><input type="radio" name="emotion" id="face6"><label for="face7"><img src="./face/face7.gif" alt=""></label><input type="radio" name="emotion" id="face7"><label for="face8"><img src="./face/face8.gif" alt=""></label><input type="radio" name="emotion" id="face8"><label for="face9"><img src="./face/face9.gif" alt=""></label><input type="radio" name="emotion" id="face9"><label for="face10"><img src="./face/face10.gif" alt=""></label><input type="radio" name="emotion" id="face10"><br><label for="face11"><img src="./face/face11.gif" alt=""></label><input type="radio" name="emotion" id="face11"><label for="face12"><img src="./face/face12.gif" alt=""></label><input type="radio" name="emotion" id="face12"><label for="face13"><img src="./face/face13.gif" alt=""></label><input type="radio" name="emotion" id="face13"><label for="face14"><img src="./face/face14.gif" alt=""></label><input type="radio" name="emotion" id="face14"><label for="face15"><img src="./face/face15.gif" alt=""></label><input type="radio" name="emotion" id="face15"><label for="face16"><img src="./face/face16.gif" alt=""></label><input type="radio" name="emotion" id="face16"><label for="face17"><img src="./face/face17.gif" alt=""></label><input type="radio" name="emotion" id="face17"><label for="face18"><img src="./face/face18.gif" alt=""></label><input type="radio" name="emotion" id="face18"><label for="face19"><img src="./face/face19.gif" alt=""></label><input type="radio" name="emotion" id="face19"><label for="face20"><img src="./face/face20.gif" alt=""></label><input type="radio" name="emotion" id="face20"></td></tr><tr><td>请选择头像：</td><td><label for="Profilephoto1"><img src="./face/pic1.gif" alt=""></label><input type="radio" name="Profilephoto" id="Profilephoto1" checked><label for="Profilephoto2"><img src="./face/pic2.gif" alt=""></label><input type="radio" name="Profilephoto" id="Profilephoto2"><label for="Profilephoto3"><img src="./face/pic3.gif" alt=""></label><input type="radio" name="Profilephoto" id="Profilephoto3"><label for="Profilephoto4"><img src="./face/pic4.gif" alt=""></label><input type="radio" name="Profilephoto" id="Profilephoto4"><label for="Profilephoto5"><img src="./face/pic5.gif" alt=""></label><input type="radio" name="Profilephoto" id="Profilephoto5"><br><label for="Profilephoto6"><img src="./face/pic6.gif" alt=""></label><input type="radio" name="Profilephoto" id="Profilephoto6"><label for="Profilephoto7"><img src="./face/pic7.gif" alt=""></label><input type="radio" name="Profilephoto" id="Profilephoto7"><label for="Profilephoto8"><img src="./face/pic8.gif" alt=""></label><input type="radio" name="Profilephoto" id="Profilephoto8"><label for="Profilephoto9"><img src="./face/pic9.gif" alt=""></label><input type="radio" name="Profilephoto" id="Profilephoto9"><label for="Profilephoto10"><img src="./face/pic10.gif" alt=""></label><input type="radio" name="Profilephoto" id="Profilephoto10"></td></tr><tr class="button"><td colspan="2"><input type="submit" value="提交留言"><input type="reset" value="重新填写"></td></tr></table></form>
</body></html>
第三个
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>同城网在线调查</title><style>table {border: 2px solid orange;border-collapse: collapse;}table tr th {text-align: left;background-color: orange;}table tr td {border: 1px solid gray;background-color: blanchedalmond;}table tr.submit td {text-align: center;}table tr.submit td input {margin: 15px;width: 50px;}</style>
</head><body><form action="post"><table><tr><th colspan="2">■同城网在线调查 </th></tr><tr><td>你从哪里知道同城的</td><td><select name="" id=""><option value="">网上搜索</option><option value="">朋友介绍</option><option value="">广告宣传</option><option value="">报刊杂志</option><option value="">其他渠道</option></select></td></tr><tr><td>你正在使用的同城网服务</td><td><input type="radio" name="1"><label for="1">免费社区</label><input type="radio" name="1"><label for="2">免费留言簿</label><input type="radio" name="1"><label for="3">免费投票</label></td></tr><tr><td>你希望我们提供哪些新服务</td><td><input type="radio" name="2"><label for="11">聊天室</label><input type="radio" name="2"><label for="22">博客</label><input type="radio" name="2"><label for="33">游戏系统</label></td></tr><tr><td>你是同城网的会员吗</td><td><input type="radio" name="3"><label for="11">是</label><input type="radio" name="3"><label for="22">不是</label></td></tr><tr><td>你对同城网的其他意见 </td><td><textarea name="suggestions" id="suggestions" cols="30" rows="10"></textarea></td></tr><tr class="submit"><td colspan="2"><input type="submit"></td></tr></table></form>
</body></html>
第二次网页设计实验报告（设计性实验）（表格+表单）相关推荐
- 计算机组成原理组合逻辑控制器实验报告,计算机组成原理实验报告—认识性实验 华北电力大学.doc...
文档介绍: 科技学院综合实验报告(2011--2012年度第一学期)名称:计算机组成原理综合实验题目:认识性实验院系:信息工程系班级:学号:学生:南方小羊指导教师:梅王晓霞设计周数:第十八周成绩:日期 ...
- html语言的使用的实验报告,html程序设计实验报告.doc
html程序设计实验报告 html程序设计实验报告 篇一:Html设计实验报告 <网页设计>实验报告 (2010-2011学年第二学期) 班 级:姓 名: 学 号:指导老师: 实验一 认识 ...
- matlab操作入门实验报告,MATLAB基本操作实验报告.doc
MATLAB基本操作实验报告MATLAB基本操作实验报告 南昌航空大学 数学与信息科学学院 实 验 报 告 课程名称: 实验名称: 实验类型: 验证性 综合性□ 设计性□ 实验室名称: 班级学号: 学 ...
- android画板的实验报告,几何画板实验报告.doc
PAGE PAGE 1 附1:本科学生综合性.设计性实验报告格式 附2: 辽宁师范大学 年第 学期综合性.设计性实验汇总表 本科学生综合性.设计性 实验报告 姓名 张莉 学号 专业 课程与教学论 班级 ...
- mysql的安全性实验报告_数据库实验报告3-SQL Server 安全性验证
数据库实验报告 JNU本科实验报告专用纸 课程名称 数据库上机实验 成绩评定 实验项目名称 SQL Server 安全性验证 指导教师 实验项目编号 08060113 实验项目类型 验证性 实验地点 ...
- javaee实验报告心得_JavaEE实验报告.doc
JavaEE实验报告 学 生 实 验 报 告 (理工类) 课程名称: J2EE程序设计 专业班级: 学生学号: 学生姓名: 所属院部: 信息技术学院 指导教师: 20 13 --20 14 学年 第 ...
- java实验册_Java实验报告册Java实验报告册.doc
Java实验报告册Java实验报告册 <面向对象程序设计> 实验报告与习题册2013 / 2014 学年 第1学期系 别 计算机科学与技术系专 业 班 级 姓 名 指导教师 目 录 项 目 ...
- c语言实验报告上理答案,C语言实验报告江西理工大学实验5
<C语言实验报告江西理工大学实验5>由会员分享,可在线阅读,更多相关<C语言实验报告江西理工大学实验5(6页珍藏版)>请在读根文库上搜索. 1.C语言程序设计实验报告教学班级: ...
- 西安交通大学计算机组成实验报告,西安交通大学实验报告
<西安交通大学实验报告>由会员分享,可在线阅读,更多相关<西安交通大学实验报告(5页珍藏版)>请在人人文库网上搜索. 1.西安交通大学实验报告课程_大学计算机_实验名称_检索绘 ...
- mm1排队系统仿真matlab实验报告,matlab仿真实验报告_mm1排队系统仿真matlab实验报告资料...
M/M/1排队系统实验报告 一.实验目的 本次实验要求实现M/M/1单窗口无限排队系统的系统仿真,利用事件调度法实现离散事件系统仿真,并统计平均队列长度以及平均等待时间等值,以与理论分析结果进行对比. ...
最新文章
- 常见跨域解决方案以及Ocelot 跨域配置
- @class #import辨析 #include
- SQLAlchemy 简单笔记
- html选择第一个clss,css3如何选择第一个子元素？
- python的设计哲学是优雅明确简单_Python简单教程
- 苹果生产日期对照表2020_苹果官方确定部分AirPods Pro出现声音问题，承诺换修
- 练习--第一次课（运算if while 字符编码）
- 采用SVM和神经网络的车牌识别（流程图及详细解释）
- elasticsearch的性能表现
- nginx代理php不能跳转页面,nginx 解决首页跳转问题详解
- ios上传图片遇见了一个TimeoutError(DOM Exception 23)异常
- Kylin RT OLAP reassign流程即重新分配replica_set 流程
- typora+PicGo-Core+smms上传图床
- Debian 支持蓝牙音响
- python之小说下载器version3.0
- PDF可以通过OCR图文识别软件转换为JPEG图像吗
- 计算机上播放时没声音什么故障,电脑经常在播放电影（音乐等）时突然没有声音...
- 为什么不建议在MySQL中使用 utf8？
- Textbox只留下边框线
- 命令提示符怎么进入D盘？简单的技能分享