源码网,源码论坛,源码之家,商业源码,游戏源码下载,discuz插件,棋牌源码下载,精品源码论坛

 找回密码
 立即注册
楼主: ttx9n

[CSS] CSS实现让文字半透明显示在图片上的方法

[复制链接]

7万

主题

861

回帖

32万

积分

论坛元老

Rank: 8Rank: 8

积分
329525
发表于 2015-5-9 16:38:17 | 显示全部楼层 |阅读模式
这篇文章主要为大家介绍了CSS实现让文字半透明显示在图片上的方法,实例分析了css使用filter:alpha控制半透明效果的技巧,需要的朋友可以参考下

本文实例讲述了CSS实现让文字半透明显示在图片上的方法。分享给大家供大家参考。具体实现方法如下:

复制代码代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>文字显示在图片上</title>
<style type="text/css">
*{
border:none;text-decoration:none
}
.wrap{
margin:8px;position:relative
}
.photo a{
position:absolute;display:block;
border:1px solid #555555;
}
.photo a:hover{
border:1px solid #FFFFFF;
}
.photo span{
width:500px;background:#000;display:block;
position:absolute;bottom:0;left:0;color:#fff;
filter:alpha(opacity=50);-moz-opacity:0.6;
opacity:0.6;font:bold 12px/30px Verdana, Arial;
text-align:center;cursor:hand;
}
.photo a:hover span{
text-decoration:underline
}
</style>
</head>
<body>
<div class="wrap">
<div class="photo">
<a href="#">
<img src="wall8.jpg" border="0" alt=""/>
<span>标题层叠在图片上,标题文字和背景半透明。鼠标经过边框换色。
</span>
</a></div>
</div>
<div>脚本之家:https://www.jb51.net/</div>
</body>

希望本文所述对大家的web网页设计有所帮助。

回复

使用道具 举报

1

主题

2万

回帖

182

积分

注册会员

Rank: 2

积分
182
发表于 2022-11-5 01:52:13 | 显示全部楼层
天天源码社区论坛
回复 支持 反对

使用道具 举报

6

主题

1万

回帖

174

积分

注册会员

Rank: 2

积分
174
发表于 2022-11-15 05:21:38 | 显示全部楼层
哈哈哈哈哈哈哈
回复 支持 反对

使用道具 举报

11

主题

2万

回帖

300

积分

中级会员

Rank: 3Rank: 3

积分
300
发表于 2023-3-3 19:36:33 | 显示全部楼层
终于找到了,我擦
回复 支持 反对

使用道具 举报

14

主题

1万

回帖

75

积分

注册会员

Rank: 2

积分
75
发表于 2023-8-21 01:45:39 | 显示全部楼层
我要金豆金豆金豆
回复 支持 反对

使用道具 举报

4

主题

2万

回帖

58

积分

注册会员

Rank: 2

积分
58
发表于 2024-2-17 22:36:14 | 显示全部楼层
还有什么好东西没
回复 支持 反对

使用道具 举报

7

主题

2万

回帖

288

积分

中级会员

Rank: 3Rank: 3

积分
288
发表于 2024-3-17 20:21:33 | 显示全部楼层
挺不错的东西
回复 支持 反对

使用道具 举报

0

主题

1万

回帖

100

积分

注册会员

Rank: 2

积分
100
发表于 2024-6-24 15:29:28 | 显示全部楼层
的谁vdvdsvdsvdsdsv
回复 支持 反对

使用道具 举报

8

主题

2万

回帖

52

积分

注册会员

Rank: 2

积分
52
发表于 2024-9-12 13:22:21 | 显示全部楼层
额头额定法国队是范德萨
回复 支持 反对

使用道具 举报

1

主题

2万

回帖

69

积分

注册会员

Rank: 2

积分
69
发表于 2024-9-20 03:42:29 | 显示全部楼层
好人好人好人好人
回复 支持 反对

使用道具 举报

高级模式
B Color Image Link Quote Code Smilies

本版积分规则

手机版|小黑屋|网站地图|源码论坛 ( 海外版 )

GMT+8, 2024-11-24 14:51 , Processed in 0.068298 second(s), 23 queries .

Powered by Discuz! X3.4

Copyright © 2001-2020, Tencent Cloud.

快速回复 返回顶部 返回列表