众所周知，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标签不支持嵌套，因此它的作用就来了。

详情请看这篇文章。

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

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

    学习jsp不得不学习jsp标签,一般来说,对于一个jsp开发者,可以理解为jsp页面中出现的java代码越少,对jsp的掌握就越好,而替换掉java代码的重要方式就是使用jsp标签.  jsp标签的分 ...

  2. 20190322-a标签、img标签、三列表、特殊字符实体、表格

    目录 1.a标签 a标签的属性 锚点 2.img标签 img标签的属性 图像热区 3.三列表 有序列表(Ordered List)     ol>li 无序列表(Unordered List)  ...

  3. 03-body标签中相关标签

    今日主要内容: 列表标签 <ul>.<ol>.<dl> 表格标签 <table> 表单标签 <fom> 一.列表标签 列表标签分为三种. 1 ...

  4. python 全栈开发，Day46(列表标签,表格标签,表单标签,css的引入方式,css选择器)

    一.列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: ul:unordered list,“无序列表”的意思. li:lis ...

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

    主要内容: 列表标签 <ul>.<ol>.<dl>表格标签 <table>表单标签 <form> 一.列表标签 列表标签分为三种. 无序列表 ...

  6. 前端之body标签中相关标签（二）

    一 列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: a.ul:unordered list,“无序列表”的意思. b.li ...

  7. Kure讲HTML_div标签和table标签

    为什么要把这两个标签放在一起讲? 个人认为div标签可以算是一个万能标签,它可以通过CSS(层叠样式表)来模仿表格的形式来生成一个表格.那么很多人可能会疑惑那在开发的时候,到底是用div+css的形式 ...

  8. Day46（列表标签，表格标签，表单标签，css的引入方式，css选择器）

    一.列表标签 列表标签分为三种. 1.无序列表<ul>,无序列表中的每一项是<li> 英文单词解释如下: ul:unordered list,“无序列表”的意思. li:lis ...

  9. html-body标签中相关标签 02

    今日主要内容: 列表标签 <ul>.<ol>.<dl> 表格标签 <table> 表单标签 <fom> 一.列表标签 列表标签分为三种. 1 ...

随机推荐

  1. SCI投稿过程总结、投稿状态解析、拒稿后对策及接受后期相关问答

    SCI投稿过程总结.投稿状态解析.拒稿后对策及接受后期相关问答   http://muchong.com/t-9174366-1 SCI投稿过程总结.投稿状态解析.拒稿后处理对策及接受后期相关问答综合 ...

  2. Qt 中的消息对话框

    1. QMessagebox 类的几个静态成员函数,可以直接调用创建对话框 StandardButton critical(QWidget * parent, const QString &  ...

  3. 《mysql必知必会》学习_第六章_20180730_欢

    第六章<过滤数据> P35 1. select prod_name,prod_price from products where prod_price=2.5; 2.select prod ...

  4. shell工具-sort

    sort sort命令是在Linux里非常有用,它将文件进行排序,并将排序结果标准输出 基本语法 sort [选项] [参数] 选项说明 选项 说明 -n 依照数值大小排序 -r 以相反的顺序排序 - ...

  5. POJ3666 线性dp_离散化_贪心

    POJ3666 线性dp_离散化_贪心 就DP而言这个题不算难,但是难就难在贪心,还有离散化的思想上 题目大意:n个土堆,问你最少移动多少单位的图,可以使得这n个土堆变成单调的 dp[i][j]表示前 ...

  6. Amoeba变形虫

    我们通过路由选择来决定操作时访问那个数据库,而路由的选择方式不外乎以下几种: 1) SpringAOP方式:spring底层配置多个数据源,配置路由(面向切面编程)手工写很多代码(废除) 2) MyS ...

  7. C# 函数式编程及Monads.net库

    函数式编程中,一切皆为函数,这个函数一般不是类级别的,其可以保存在变量中,可以当做参数或返回值,是函数级别的抽象和重用,将函数作为可重用的基本模块,就像面向对象中一切皆为对象,把所有事物抽象为类,面向 ...

  8. Android-Java-Thread线程两种方式的使用场景

    Thread线程两种方式的优点/缺点 extends Thread 方式: 缺点:存在耦合度(因为线程任务run方法里面的业务逻辑 和 线程启动耦合了) 缺点:Cat extends Thread { ...

  9. asp.net core mvc 中间件之WebpackDevMiddleware

    asp.net core mvc 中间件之WebpackDevMiddleware WebpackDevMiddleware中间件主要用于开发SPA应用,启用Webpack,增强网页开发体验.好吧,你 ...

  10. 存储过程 Mvc 的调用

    /// <summary>        /// 根据条件,使用存储过程分页查询电影        /// </summary>        /// <param na ...