众所周知,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. poj 3013 最短路变形

    http://poj.org/problem?id=3013 给出n个点,m个边.给出每个点的权值,每个边的权值.在m条边中选n-1条边使这n个点成为一棵树,root=1,求这棵树的最小费用,费用=树 ...

  2. hdu 5060 五种情况求圆柱体与球体交

    http://acm.hdu.edu.cn/showproblem.php?pid=5060 官方题解http://bestcoder.hdu.edu.cn/给复杂了 实际上用圆柱体与球体体积差的积分 ...

  3. [LintCode] Longest Increasing Continuous subsequence

    http://www.lintcode.com/en/problem/longest-increasing-continuous-subsequence/# Give you an integer a ...

  4. .net core 使用 AspectCore 实现简易的AopCache。

    (第一次写博客,好紧张!!!) 源码地址:传送门 项目中有很多缓存的需求,能自己定义缓存key和时间,能根据key去清理缓存. 网上找了一圈,有很多基于aop的缓存组件,但是都不满足我的需求.故造了个 ...

  5. 在Winform中菜单动态添加“最近使用文件”

    最近在做文件处理系统中,要把最近打开文件显示出来,方便用户使用.网上资料有说,去遍历“C:\Documents and Settings\Administrator\Recent”下的最近文档本.文主 ...

  6. 【转】Windows Server 2016 安装 IIS 服务时提示指定备用源路径

    原文地址:http://www.codingwhy.com/view/973.html 在Windows Serever 2016中安装IIS的时候,遇到以下提示 是否需要指定备用源路径?一个或多个安 ...

  7. AJPFX:外汇的价格图表类型和技术指标类型

    AJPFX:价格图表的类型 柱状图 它是反映价格行为的一种最基本的图表.每一根柱代表一段时间——最短为1分钟,最长为数年.随着时间的推移,柱状图反映出不同的价格形态. 蜡烛图 不同于简单的柱状图,蜡烛 ...

  8. flask_maple使用文档

    安装 To install Flask-Maple: pip install flask-maple Or alternatively, you can download the repository ...

  9. [学习笔记]树套树 线段树套Splay

    今天调了一个早上哈哈哈,不过因为\(Splay\),常数比较大 洛谷的评测记录: \(Code\ Below:\) #include <bits/stdc++.h> #define ll ...

  10. Redis---基础数据结构

    1.String(字符串) 1.1 概述 字符串 string 是 Redis 最简单的数据结构.Redis 所有的数据结构都是以唯一的 key 字符串作为名称,然后通过这个唯一 key 值来获取相应 ...