HTML(超链接,建立锚点,建立图像,图像地图)

这篇博客详细介绍了HTML中创建超链接、设置锚点、插入图像以及使用图像地图的基本语法和应用。通过实例展示了如何创建链接到外部网站、页面内部跳转、设置图像边框、定义图像地图等,帮助读者理解HTML页面元素的交互和导航功能。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

<html>
 <head>
  <title>超链接标签</title>
 </head>
 <body>
  <a href="http://syt.coolpage.biz" target="_blank">syt的窝</a><br>
  <a href="./html/web.html" target="_blank">web.html</a><br>
 </body>

</html>

<html>
 <head>
  <title>建立锚点标签</title>
 </head>
 <body> 
  <a href="#one">第一段</a><br>
  <a href="#two">第二段</a><br>
  <a href="#three">第三段</a><br>
  <a href="http://www.baidu.com/one.php#four">four</a><br>
  
  <a name="one">
  aaaaa<br>
  aaaaa<br>
  aaaaa<br>
  aaaaa<br>
  aaaaa<br>
  aaaaa<br>
  aaaaa<br>
  aaaaa<br>
  aaaaa<br>
  aaaaa<br>
  aaaaa<br>
  aaaaa<br>
  aaaaa<br>
  aaaaa<br>
  aaaaa<br>
  aaaaa<br>
  aaaaa<br>
  aaaaa<br>
  aaaaa<br>
  aaaaa<br>
  aaaaa<br></a>
 <a href="#">返回</a><br>

  <a name="two">
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br>
   bbbbb<br></a>
  <a href="#">返回</a><br>

  <a name="three">
   cccccc<br>
   cccccc<br>
   cccccc<br>
   cccccc<br>
   cccccc<br>
   cccccc<br>
   cccccc<br>
   cccccc<br>
   cccccc<br>
   cccccc<br>
   cccccc<br>
   cccccc<br>
   cccccc<br>
   cccccc<br>
   cccccc<br>
   cccccc<br>
   cccccc<br>
   cccccc<br>
   cccccc<br>
   cccccc<br>
   cccccc<br></a>
  <a href="mailto:sysydesigns@live.cn?subject=lamp&hello&cc=sysydesign@gmail.com">留言</a>

  <a href="#">返回</a><br>

 

 </body>
</html>

 

<html>
 <head>
  <title>建立图像标签</title>
 </head>
 <body>
  
  <a href="http://localhost/cms/index.php"><img src="logo.jpg" border=0 width=50% alt="xsphp_logo"/><br></a> <br>
  <a href="http://www.lampbrother.net" target="_blank"><img src="http://www.lampbrother.net/images/logo.gif"  border="10" width=500 alt="lamp brother logo"/></a><br>
 </body>
</html>

 

<img>

src: 指定图片URL

border:边框

alt:1.鼠标放上有小黄图标 2.若图像不存在,则出现指定文字 3.搜索引擎可以用过它的制定文字搜索该图.

 

<html>
 <head>
  <title>图像地图</title>
 </head>
 <body>
  <a href="http://localhost/cms/index.php"><img src="logo.jpg" border=0 width=50% alt="xsphp_logo" /></a><br><br>

  <img src="logo.jpg" usemap="#mymap" border=0 />

  <map name="mymap">
   <area shape="rect" coords="5,5,50,50" href="http://www.php.net" target="_blank">
   <area shape="circle" coords="80,40,40" href="http://www.apache.org" target="_blank">
   <area shape="poly" coords="175,0,110,70,100,70" href="http://www.linux.com" target="_blank">
  </map>

 </body>
</html>

 

<map>定义热点区域

<area>指定每个热点区域

shape="形状"(如上例所示)

coords:位置坐标

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值