HTML Web图形样式基础2

本文介绍了如何在HTML中使用<img>标签创建图片链接,并通过CSS配置背景图片及多张背景图片的方法。包括如何消除图片链接的边框效果,以及在不同浏览器中的兼容性处理。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

3.使用图片链接

为了创建图片链接,只需要在<img>标记两边加上锚标记,例如:

<a href="www.google.com"><img src="like.gif" height="30" width="20" alt="home"></a>

图片作为链接时,默认会在图片周围显示一圈蓝色的轮廓(边框)。如果不希望显示这个边框,可以在img标记中使用border="0“属性,例如:

<a href="www.google.com"><img src="like.gif" height="30" width="20" alt="home" border="0"></a>

4.配置背景图片

使用CSS的background-color属性配置背景颜色,相似的可以使用CSS的background-image属性配置背景图片,例如:

body { background-image: url ( big.jpg ) ;}

也可以同时使用背景颜色和图片,例如:

body { background-image: url ( big.jpg ) ;

           background-color: red;}

5.CSS3多张背景图片

多张背景图片用CSS3 background 属性配置。每张图片声明都用逗号分开。可选择添加属性值来指定图片位置以及图片是否重复。background属性采用的是一种速记表示法,只列出和background-position和background-repeat等属性对应的值。代码如下:

body { background-color: #f4ffe4;color: #333333;

           background-image: url ( 01.png);

           background:     url(02.gif) no-repeat bottom right,

                                    url(01.png);)

同时使用background-image和  background 属性是为了使一些不支持的浏览器能正常显示背景图片。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值