首页 > 其他分享 >第七章作业1

第七章作业1

时间:2024-10-24 20:18:34浏览次数:10  
标签:翡翠 center 作业 100px height 第七章 text border

利用CSS技术,结合表格和列表,制作并美化“翡翠阁”页面

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>翡翠阁</title>
		<style type="text/css">
			.wz{
				height: 100px;
				line-height: 100px;
				text-align: center;
				background: url(img/cap.jpg) no-repeat;
				background-position: center;
			}
			.wz2{
				width:700px;
				height:550px;
				border:1px solid;
				margin:0 auto;
			}
			td{
				height:100px;
				text-align: center;
			}
			img{
				width:150px;
				height:140px;
				margin: 10px 0px 0 17px;
				border:1px solid;
			}
			
		</style>
		
	</head>
	<body>
		<div class="wz"><h2>翡翠阁</h2></div>
		<div class="wz2">
			<table>
				<tr>
					<td><img src="img/li1.jpg"/></td>
					<td><img src="img/li2.jpg"/></td>
					<td><img src="img/li3.jpg"/></td>
					<td><img src="img/li4.jpg"/></td>
				</tr>
				<tr>
					<td>翡翠项链坠子<br />¥1500元</td>
					<td>羊脂玉戒指<br />¥2300元</td>
					<td>紫玉手链<br />¥2880元</td>
					<td>羊头黄玉<br />¥999元</td>
				</tr>
				<tr>
					<td><img src="img/li5.jpg"/></td>
					<td><img src="img/li6.jpg"/></td>
					<td><img src="img/li7.jpg"/></td>
					<td><img src="img/li8.jpg"/></td>
				</tr>
				<tr>
					<td>翡翠挂件<br />¥1800元</td>
					<td>翡翠蝴蝶胸口<br />¥3300元</td>
					<td>翡翠耳坠<br />¥2380元</td>
					<td>翡翠白金镯子<br />¥9999元</td>
				</tr>
			</table>
		</div>
	</body>
</html>

标签:翡翠,center,作业,100px,height,第七章,text,border
From: https://blog.csdn.net/2301_79438088/article/details/143218596

相关文章

  • 数据库作业3
    准备工作:(1).分别查询student表和score表的所有记录(2).查询student表的第2条到5条记录(3).从student表中查询计算机系和英语系的学生的信息、(4).从student表中查询年龄小于22岁的学生信息(5).从student表中查询每个院系有多少人(6).从score表中查询每个科目的......
  • 【JAVA毕业设计】基于Vue和SpringBoot的课程作业管理系统
    本文项目编号T023,文末自助获取源码\color{red}{T023,文末自助获取源码}......
  • 77.优美的鲜花网店网页 ​Web前端网页制作 大学生期末大作业 html+css+js
    目录一、前言二、网页文件三、网页效果四、代码展示1.HTML2.CSS3.JS五、更多推荐一、前言本实例以鲜花为主题设计,应用html+css+js,包括DIV布局、图片轮翻效果、菜单导航、二级三级菜单、留言板、搜索等,供大家参考。本网页支持如Dreamweaver、HBuilder、Text、Vscode......
  • MQL实验(二)作业
    1.求供应工程J1零件的供应商号码SNO,输出结果不重复。selectdistinctsnofromspjwherejno='j1';2.求供应工程J1零件P1的供应商号码SNO,输出结果不重复。selectdistinctsnofromspjwherejno='j1'andpno='p1';3.求供应工程J1零件为红色的供应商号码SNO,输出结果不......
  • [实时计算flink]数据摄入YAML作业快速入门
    实时计算Flink版基于Flink CDC,通过开发YAML作业的方式有效地实现了将数据从源端同步到目标端的数据摄入工作。本文介绍如何快速构建一个YAML作业将MySQL库中的所有数据同步到StarRocks中。前提条件已创建Flink工作空间,详情请参见开通实时计算Flink版。上下游存储已创建......
  • HTML静态网页成品作业(HTML+CSS)——中华传统美德介绍网页(2个页面)
    ......
  • 第六章作业
    <!DOCTYPEhtml><html> <head> <metacharset="utf-8"> <title>旅游攻略网站</title> <styletype="text/css"> .all{ width:600px; height:800px; background:url(img/bg.JPG); } ......
  • 第六章 课后作业
    1.使用css对页面元素加以修饰制作“旅游攻略”网站<!DOCTYPEhtml><html> <head> <metacharset="utf-8"> <title>旅游攻略</title> <styletype="text/css"> .all{ width:700px; height:600px; border:0px......
  • 《Pytorch深度学习实践》P8 Dataset and DataLoader 笔记+代码+作业:DataLoader的使用
     b站的up主刘二大人的《PyTorch深度学习实践》P8笔记+代码,视频链接。所需糖尿病数据可以在视频评论区下方的网盘资源里下载(转载评论区):链接:https://pan.baidu.com/s/1cUI518pgLWY1oCn2DkjuEQ?pwd=kif1 提取码:kif1或者是点击链接下载:【免费】b站的up主刘二大人的《PyTorc......
  • 536.响应式大鱼海棠电影宣传网页 大学生期末大作业 Web前端网页制作 html+css+js
    目录一、网页概述二、网页文件 三、网页效果四、代码展示1.html2.CSS3.JS五、总结1.简洁实用2.使用方便3.整体性好4.形象突出5.交互式强六、更多推荐欢迎光临仙女的网页世界!这里有各行各业的Web前端网页制作的案例,样式齐全新颖,并持续更新!感谢CSDN,提供了这......