1.作业1
提示:
标题在title中修改
百度logo是图片链接(img)
新闻,贴吧是超链接,直接上官网cv
还有文本呢输入框
完成前端HTML代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>百度仿真页面</title>
</head>
<body align="center">
<p><img src="https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png" alt=""></p>
<p>
<a href="https://news.baidu.com/">新闻</a>
<a href="https://map.baidu.com/@13047515,4707691,13z">地图</a>
<a href="https://tieba.baidu.com/index.html">贴吧</a>
<a href="https://haokan.baidu.com/?sfrom=baidu-top">视频</a>
<a href="https://image.baidu.com/">图片</a>
<a href="https://wenku.baidu.com/?fr=bdpcindex">文库</a>
<a href="https://pan.baidu.com/disk/main?from=1026962h&_at_=1726381996098">网盘</a>
<a href="https://chat.baidu.com/search?isShowHello=1&pd=csaitab&setype=csaitab&extParamsJson=%7B%22enter_type%22%3A%22home_tab%22%7D">AI助手</a>
<a href="https://www.baidu.com/more/">更多</a>
</p>
<input type="text" size="40px">
<input type="button" value="百度一下"> <p></p>
<p>问题反馈请<a href="">发送邮件</a></p>
</body>
</html>
显示的效果如下:
2.作业2
思考如何制作上面的表格
提示:
这里看似是只有一个表格,其实呢可以由很多个表格合并获得
但是要注意设置表格的宽度为一个值,这样显示的效果就是相当于一个表格了
完整代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>第29届中国国际广告节会议注册表</title>
<style>
th, td {
border: 1px solid #3498db; /* 更改这里的颜色值 */
padding: 8px;
text-align: center;
}
</style>
</head>
<body align="center" >
<h1>第29届中国国际广告节会议注册表</h1>
<form action="">
<table align="center" border="1" width="800px">
<!-- <caption>第29届中国国际广告节会议注册表</caption> -->
<tr>
<td>参赛者姓名</td>
<td><input type="text"></td>
<td>职务</td>
<td><input type="text"></td>
</tr>
</table>
<table align="center" border="1" width="800px">
<tr>
<td>工作单位</td>
<td><input type="text" size="100px"></td>
</tr>
</table>
<table align="center" border="1" width="800px">
<tr>
<td>电话</td>
<td><input type="text"></td>
<td>传真</td>
<td><input type="text"></td>
<td>手机</td>
<td><input type="text"></td>
</tr>
</table>
<table align="center" border="1" width="800px">
<tr>
<td>通讯地址</td>
<td><input type="text"></td>
<td>邮箱</td>
<td><input type="text"></td>
</tr>
<tr>
<td>E-mail</td>
<td><input type="text"></td>
<td>国家</td>
<td>
<select name="" id="">
<option value="">中国</option>
<option value="">俄罗斯</option>
<option value="">法国</option>
</select>
</td>
</tr>
<tr>
<td>省份</td>
<td>
<select name="" id="">
<option value="">天津</option>
<option value="">北京</option>
<option value="">江西</option>
</select>
</td>
<td>城市</td>
<td><input type="text"></td>
</tr>
</table>
<table align="center" border="1" width="800px" height="80px">
<tr>
<td>会议费标准(人名币)</td>
</tr>
<caption></caption>
</table>
<table align="center" border="1" width="800px">
<!-- <caption>会议费标准(人名币)</caption> -->
<tr>
<td>身份/时间</td>
<td>2022年9月20日之前注册</td>
<td>2022年9月20日之后注册</td>
</tr>
<tr>
<td>中广协会会员</td>
<td><input type="radio" name="r1">1500元</td>
<td><input type="radio" name="r1">1800元</td>
</tr>
<tr>
<td>非会员</td>
<td><input type="radio" name="r1">1800元</td>
<td><input type="radio" name="r1">2000元</td>
</tr>
</table>
<table align="center" border="1" width="800px">
<tr>
<td><input type="submit" style="background-color: aqua;">
<input type="reset" style="background-color: aqua;"></input></td>
</tr>
</table>
<table align="center" border="1" width="800px">
<tr>
<td><a href="">第29届中国国际广告节会议注册表下载</a></td>
</tr>
</table>
</form>
</body>
</html>
显示的效果为: