请选择 进入手机版 | 继续访问电脑版

CSS背景图片添加超链接的方法教程

[复制链接]
查看4268 | 回复1 | 2019-7-9 07:22 | 显示全部楼层 |阅读模式
CSS背景图片添加超链接的方法教程
在做页面时候,有时难免会把图片图片做成背景,但是又想加个链接,可以采用下面的办法解决。
#logo { width:249px; height:62px;  background-image:url(images/logo.gif);}
#logo a{ display:block;  width:249px;  height:62px;  cursor:hand; }
然后在<html>里加入以下代码
<div id="logo"><a href="http://www.zidiu.com"></a>

用IE浏览图片就能有超链接,鼠标并以一个小手出现,在dreamweaver效果是一样的。
特别说明:为背景加超链接时必须加display:block,并且按Logo图片的大小定义好它的宽和高。这样才能达到想要的效果。

a 元素是是一个行内元素,display:block;就是将他强行转化为块级元素。行内元素没有没有上下填充。display:block;是让连接表现得像块极元素,增大起点击区域。以为你后面的a:hove背景图片的实现打下基础。

苹果 | 2019-8-20 06:55 | 显示全部楼层
技术学习教程网,支持一下。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

UID
1
贡献
387
丢币
38902
主题
4607
回帖
116
注册时间
2018-9-25
最后登录
2024-3-24