zoukankan      html  css  js  c++  java
  • 【html】点击图片内链接进行跳转

    博主因为工作中遇到,有些UI图片里有多个链接,要求用户可以点击图片内相关的链接进行跳转。

    比如:以下是一张图片(非页面),但是要求点击图片不同位置,跳转到不同网址:

    方法:

    1.如果仅在PC端展示页面:

    可以使用coords属性,具体参考网址:

    HTML <a> 标签的 coords 属性

    2.如果要求同时在PC端和手机端做展示:

    可以对图片进行切割:(就是将一个大的 图片拆成多个小图片,然后在有链接的小图片上加上 href链接)

    <body>
    		<a href="#" class="img-box">
    			<img src="/images/am_01.png" />
    		</a>
    		<a href="#" class="img-box">
    			<img src="/images/am_02.png" />
    		</a>
    		<a href="#" class="img-box">
    			<img src="/images/am_03.png" />
    		</a>
    		<a href="#" class="img-box">
    			<img src="/images/am_04.png" />
    		</a>
    		<a href="https://你的链接/" class="img-box">
    			<img src="/images/am_05.png" />
    		</a>
    		<a href="#" class="img-box">
    			<img src="/images/am_06.png" />
    		</a>
    		<a href="#" class="img-box">
    			<img src="/images/am_07.png" />
    		</a>
    	</body>
  • 相关阅读:
    Spring的bean管理(注解)
    IOC 和DI的区别
    java spring属性注入
    Java 接口
    JAVA 修饰符
    Day19-File操作-创建 删除,文件过滤
    Eclipse快捷键大全
    Day17总结
    启动人人项目遇到的问题
    Eclipse 各版本号
  • 原文地址:https://www.cnblogs.com/tzeyeung/p/13531320.html
Copyright © 2011-2022 走看看