使用area标签模仿a标签

众所周知,map标签可以给img图像标记热点区域,而area标签就是跟map标签一起使用的。

但area标签的作用可不止用来标记热点,因为它也有href属性,因此某些场景可以代替a标签进行页面跳转。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style type="text/css">
        area{position: absolute;left: 0;width: 80px;height: 20px;}
    </style>
</head>
<body>
    <p>
        <area shape="rect" coords="0,0,30,10" href="">点击这里
    </p>
</body>
</html>

什么样的场景会需要这个?

a标签不支持嵌套,因此它的作用就来了。

详情请看这篇文章

时间: 2024-10-20 09:23:14

使用area标签模仿a标签的相关文章

学会怎样使用Jsp 内置标签、jstl标签库及自定义标签

学习jsp不得不学习jsp标签,一般来说,对于一个jsp开发者,可以理解为jsp页面中出现的java代码越少,对jsp的掌握就越好,而替换掉java代码的重要方式就是使用jsp标签. jsp标签的分类: 1)内置标签(动作标签): 不需要在jsp页面导入标签 2)jstl标签: 需要在jsp页面中导入标签 3)自定义标签 : 开发者自行定义,需要在jsp页面导入标签 1.内置标签(动作标签): <jsp:forward />转发标签: 语法:<jsp:forward page="

HTML5标签与HTML4标签的区别示例介绍_html5教程技巧

(1)概念的变化: HTML5专注内容与结构,而不专注的表现 <header> <hgroup>导航相关数据</hgroup> </header> <nav>菜单</nav> <article> <h1>标题:HTML5专题视频教程</h1> (2)声明与标签: HTML5在更多的声明和标签上面做了简化,也对兼容做了详细的规定,废除了部分元素,增加了部分元素. HTML5标签语法介绍及新增标记 1.

表格标签,图片标签,框架标签,表单标签

一)表格标签 <table>标签 表格里面需要设置单元格的行,在行内设置单元格代表该行的列. 通过改变table的属性还有单元格的属性可以设置单元格的跨度,字体,对齐方式等. 示例: <table align="center" border="1px" width="400pt" height="300pt"> <tr> <th colspan="3">学习成

03-body标签中相关标签

今日主要内容: 列表标签 <ul>.<ol>.<dl> 表格标签 <table> 表单标签 <fom> 一.列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: ul:unordered list,"无序列表"的意思. li:list item,"列表项"的意思. 示例: <ul> <li>张三</li&g

03-body标签中相关标签-2

主要内容: 列表标签 <ul>.<ol>.<dl>表格标签 <table>表单标签 <form> 一.列表标签 列表标签分为三种. 无序列表 有序列表 定义列表 1.无序列表<ul>,无序列表中的每一项是<li> 1.1.英文单词解释如下:ul:unordered list,"无序列表"的意思.li:list item,"列表项"的意思. 示例: <ul> <li&

前端之body标签中相关标签(二)

一 列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: a.ul:unordered list,“无序列表”的意思. b.li:list item,“列表项”的意思. 示例: <ul> <li>张三</li> <li>李四</li> <li>王五</li> </ul> 效果: 注意: a.li不能单独存在,必须包裹在ul里面:反过来说,u

Jsp的内置标签和jstl标签

1.内置标签(动作标签) 内置标签不需要再jsp页面导入标签 1).forward:请求的转发,格式如下 <%-- 作用与这个相同 <%request.getRequestDispatcher("/forward2.jsp?name=gqxing").forward(request, response); %> --%> <jsp:forward page="/forward2.jsp"> <jsp:param value=

HTML的两类标签:行标签、块标签

HTML的两类标签:行标签.块标签 行标签:包含a.span.em.strong.img.var: a标签:主要用来链接一个其他的网页: span标签:主要用来对行内的文字进行一些样式以及其他的操作: em标签:一般用来对文字进行强调,使用斜体体现出来: strong标签:一般用来对文字进行强调,使用加粗字体体现出来: img标签:图片引用标签,其中 src属性中写入图片的地址: var标签:JavaScript中命名变量的标签. 块标签:包含p.div.ul.ol.li.dl.dt.dd.h1

HTML基础(一)——一般标签、常用标签和表格

第一部分  HTML <html>    --开始标签 <head> 网页上的控制信息 <title>页面标题</title> </head> <body> 页面显示的内容 </body> </html>    --结束标签 <!--注释内容--> 注释 body的属性: bgcolor                 页面背景色 text                    文字颜色(规定所有文