学习PHP的过程记录(4)-常用标签3

1、超链接标签

<html>
	<head>
		<title>
			超链接标签学习
		</title>
	</head>

	<body>
		<!-- target 属性 : -->
		<!-- _self 在自己的窗体里面打开URL -->
		<!-- _blank 在新的窗体里面打开URL -->	
		<a href="http://www.baidu.com" target="_blank"> 百度 </a>


	</body>
</html>

2、锚点

<html>
	<head>
		<title> 建立锚点标签</title>
	</head>

	<!-- 锚点的建立 <a name="XXX">YYY</a>  -->
	<!-- 使用时使用#连接 -->
	<body>
	<hr width="100%" size="10" color="red" />
	<ul>
		<li><a href="#poem1"> 第一首诗:相思 </a> </li>
		<li><a href="#poem2"> 第二首诗:静夜思 </a> </li>
		<li><a href="#poem3"> 第三首诗:将进酒 </a> </li>
		<li><a href="#poem4"> 第四首诗:虞美人 </a> </li>

	</ul>

	<img src="E:\学习\PHP笔记和练习\06\1.jpg" />
	<hr width="100%" size="10" color="orange" />
	<a name="poem1">
	<h2>相思</h2>
	红豆生南国,春来发几枝。<br/>
	愿君多采撷,此物最相思。<br/>
	</a>

	<img src="E:\学习\PHP笔记和练习\06\1.jpg" />
	<hr width="100%" size="10" color="yellow" />
	<a name="poem2">
	<h2>静夜思</h2>
	床前明月光,疑是地上霜。<br />
	举头望明月,低头思故乡。<br />
	</a>

	<img src="E:\学习\PHP笔记和练习\06\1.jpg" />
	<hr width="100%" size="10" color="green" />
	<a name="poem3">
	<h2>将进酒</h2>
	君不见,黄河之水天上来,奔流到海不复回。<br />
  	君不见,高堂明镜悲白发,朝如青丝暮成雪!<br />
   	人生得意须尽欢,莫使金樽空对月。<br />
 	天生我材必有用,千金散尽还复来。<br />
 	烹羊宰牛且为乐,会须一饮三百杯。<br />
 	岑夫子,丹丘生,将进酒,杯莫停。<br />
 	与君歌一曲,请君为我倾耳听。<br />
  	钟鼓馔玉不足贵,但愿长醉不复醒。<br />
 	古来圣贤皆寂寞,惟有饮者留其名。<br />
 	陈王昔时宴平乐,斗酒十千恣欢谑。<br />
 	主人何为言少钱,径须沽取对君酌。<br />
 	五花马、千金裘,呼儿将出换美酒,与尔同销万古愁!<br />
	</a>

	<img src="E:\学习\PHP笔记和练习\06\1.jpg" />
	<hr width="100%" size="10" color="grey" />
	<a name="poem4">
	<h2>虞美人</h2>
	春花秋月何时了,<br />
	往事知多少。<br />
	小楼昨夜又东风,<br />
	故国不堪回首月明中。<br /><br /><br />
  	雕阑玉砌应犹在,<br />
	只是朱颜改。<br />
	问君能有几多愁,<br />
	恰是一江春水向东流。<br />
	</a>

	<img src="E:\学习\PHP笔记和练习\06\1.jpg" />
	<hr width="100%" size="10" color="blue" />
 	<a href="mailto:tcao2014@163.com"> 给我发邮件 </a>     
	<hr width="100%" size="10" color="balck" />
	<a href="#"> 返回顶端 </a> 
	
	</body>

</html>

3、图像标签

<html>
	<head>
		<title> 图像标签 </title>
	</head>

	<!-- <img> 标签 -->
	<!-- src 指定图片所在的URL -->
	<!-- border 边框的宽度 -->
	<!--  alt 鼠标放上有提示 如果图像不存在,则出现它指定的文字,搜索引擎可以通过它指定文字搜索改图片-->
	<!-- width height -->
	<body>

	<center>
		<a href="http://hao.360.cn/" target="_self">
			<img src="http://p1.qhimg.com/t0151320b1d0fc50be8.png" border="0" alt="360_logo_forTest"/>
		</a>
	</center>

	<br />
	<br />
	<br />
	<br />

	<center>
		<a href="http://sh.qihoo.com/zt/2014daguolingxiu.html?src=hao360" targrt="_blank">
			<img src="http://p5.qhimg.com/t01e3748dd2a063cd67.jpg" border="100" alt="Chairman_Xi"/>
		</a>
	</center>
	
	</body>



</html>

4、图像地图

<html>
	<head>
		<title>图像地图</title>
	</head>
	
	<!-- 把一个图片分成多个链接 -->

	<body>
		<img src="E:\学习\PHP笔记和练习\06\2.jpg" usemap="#testMap" /> 

		<map name="testMap">
			<!-- 图片的左上角点是(0,0)坐标 -->
			<area shape="rect" coords="5,5,400,632" href="http://www.taobao.com" target="_blank" />
			<area shape="circle" coords="600,300,300" href="http://www.jd.com" target="_blank" />
			<area shape="poly" coords="1000,0,800,630,1200,630" href="http://xa.meituan.com" target="_blank" />
		</map>
	</body>




</html>


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值