众所周知，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. Linux 修改默认的 yum 源

    官方的yum源在国内访问效果不佳. 需要改为国内比较好的阿里的 yum源,因为每次装的时候都得百度,所以这里记录一下. 修改方式: 1)cd /etc/yum.repos.d/ 这个目录下普通用户可能 ...

  2. Ubuntu12.04 root用户登录设置

    ubuntu12.04默认是不允许root登录的,在登录窗口只能看到普通用户和访客登录.以普通身份登录Ubuntu后我们需要做一些修改. 1.普通用户登录后,修改系统配置文件需要切换到超级用户模式,在 ...

  3. CentOS7下gitlab的搭建

    gitlab的搭建 安装基础包 yum -y install curl policycoreutils openssh-server openssh-clients 启动sshd systemctl ...

  4. Ubuntu 16.04下安装golang

    手动安装 下载golang安装包 https://studygolang.com/dl 从上面的网站上下载适合自己机器的go版本,我这里选择的是go1.10.linux-386.tar.gz 解压安装 ...

  5. SpringCloud之Fegin

    Fegin是一个声明似的web服务客户端,它使得编写web服务客户端变得更加容易.使用Fegin创建一个接口并对它进行注解.它具有可插拔的注解支持包括Feign注解与JAX-RS注解,Feign还支持 ...

  6. SpringBoot启动过程分析

    我们知道,SpringBoot程序的启动很简单,代码如下: @SpringBootApplication public class Application { public static void m ...

  7. sudoer命令各参数含义及设置

    对于普通用户sudo加权的时限制可以执行的命令 https://segmentfault.com/a/1190000007394449 需要修改/etc/sudoers 1. 字段说明如下 授权用户/ ...

  8. 容器监控：cadvisor+influxdb+grafana

    cAdvisor:Google开源的工具,用于监控Docker主机和容器系统资源,通过图形页面实时显示数据,但不存储:它通过宿主机/proc./sys./var/lib/docker等目录下文件获取宿 ...

  9. 题解 P2146 【[NOI2015]软件包管理器】

    题目大意 ​ 给你一棵树, 求一点到根的路径上有多少个未标记点并全标记, 和询问一个点的子树内有多少已标记点和撤销标记 解题方法 1: install 操作 ​ 这个操作是求一点到根的路径上有多少个未 ...

  10. Python之tkinter中的askyescancel窗口返回值

    if messagebox.askokcancel(title="确认取消",message="您确认注册该账号吗?"): messagebox.showinf ...