Html练习3

点击Daisy ,Rose,Daffodil跳转到相应位置;


点击第1、2、3副图分别跳转到,以下三个网页

第2个网页    02.html

第三个网页,03.html

第四个网页,04html


第一个网页

<!doctype html>
<html>
	 <head>
	  <meta charset="UTF-8">
	  <meta name="Author" content="hesixi">
	  <meta name="Keywords" content="">
	  <meta name="Description" content="">
	  <title>Day02_1</title>
	 </head>
	 <body>
			<h1 align="center">Flowers</h1>
			<table>
				<tr>
					<td width="120px"><a href="#01">Daisy</a></td>
					<td width="120px"><a href="#02">Rose</a></td>
					<td width="120px"><a href="#03">Daffodil</a></td>
				</tr>
			</table>
				<h2 id="01">Daisy</h2>
					<a href="02.html" target="_blank">
						<img src="images/daisy.jpg" width="480px" height="360px"></a>
						<span>
							 A versatile flower, and sending daisies is always a pleasant way to make a lasting impression.
						</span>
			<h2 id="02">Rose</h2>
			<a href="03.html" target="_blank">
				<img src="images/rose.jpg" width="480px" height="360px"></a>
				<span>
					 With sunshine, water, and careful tending, rose will bloom several times in a season.
				</span>
			<h2 id="03">Daffodil</h2>
			<a href="04.html" target="_blank">
				<img src="images/daffodil.jpg" width="480px" height="360px"></a>
				<span>
					 Daffodils bloom early in spring and welcome the growing season.
				</span>
			<br/>
			<br/>
			<br/>
			<p>
				<a href="#">
					<img src="images/top.gif" width="34px" height="9px"></a>
			</p>
	 </body>
</html>

第二个网页
<!doctype html>
<html>
	 <head>
			<meta charset="UTF-8">
			<meta name="Generator" content="EditPlus®">
			<meta name="Author" content="">
			<meta name="Keywords" content="">
			<meta name="Description" content="">
			<title>Day02_2</title>
	 </head>
 <body>
		<h2>Daisy</h2>
		<img src="images/daisy.jpg" width="480px" height="360px"><br/>
		A versatile flower, and sending daisies is always a pleasant way to make a lasting impression.
 </body>
</html>

第三、四个网页和第二个网页相似,这里不予展示源码了!


可以点击下载图片素材!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值