ie7+背景透明文字不透明超級簡單的實現(xiàn)方法
如果你現(xiàn)在還在為背景透明文字不透明而發(fā)愁的話,建議你來看看。當然IE6我已經(jīng)放棄了,所以不要說不用PNG8的圖片這樣在IE6下沒有效果,當然你也可以用濾鏡。本人不建議使用濾鏡。因為這樣可能會出現(xiàn)其它問題?。ㄈ鐭o法點擊等等問題)做前端最怕的就是BUG,特別是IE6。滾蛋IE6!
本文的核心就是利用PNG32透明圖片來做背景然后平鋪背景就行了。這樣就不會存在背景透明文字也透明了。這樣做起來超級簡單你們說呢!
圖片只需要調(diào)整透明度即可。
在PSD中把圖片設(shè)置為20%的透明度保存為png就行了。
(切忌:不要設(shè)置模式為灰度。這樣會變成png8了。而且沒有透明度。)
背景透明,文字不透明。哈哈。IE 6滾蛋啦!支持:IE7.0+/FF3.0+/Opera10+/Chrome/Safari 。均測試通過。
效果圖如下:

完整代碼如下:
<!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=gb2312" />
<title>ie7+背景透明,文字不透明超級簡單的方法</title>
<style>
p{margin:0;padding:0;}
.bg{width:280px;padding:5px;margin:10px 0 10px;}
.bg1{background:#000;color:#fff;}
.bg2{background:#f60;}
.com{background:url(http://images/css_bg.png) repeat 0 0;border:1px solid #eee;border-radius:5px;font-size:12px;padding:5px;line-height:20px;}
</style>
</head>
<body>
<div class="bg bg1">
<div class="com"><p>背景透明,文字不透明。哈哈。IE 6滾蛋啦<br />支持:<br />IE7.0+/FF3.0+/Opera10+/Chrome/Safari <br />均測試通過。透明度為:20%</p></div>
</div>
<div class="bg bg2">
<div class="com"><p>背景透明,文字不透明。哈哈。IE 6滾蛋啦<br />支持:<br />IE7.0+/FF3.0+/Opera10+/Chrome/Safari <br />均測試通過。透明度為:20%</p></div>
</div>
</body>
</html>
相關(guān)文章
數(shù)據(jù)結(jié)構(gòu)中的各種排序方法小結(jié)(JS實現(xiàn))
下面小編就為大家?guī)硪黄獢?shù)據(jù)結(jié)構(gòu)中的各種排序方法小結(jié)(JS實現(xiàn))。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-07-07
新手學(xué)習(xí)前端之js模仿淘寶主頁網(wǎng)站
淘寶網(wǎng)大家在熟悉不過了,那么淘寶網(wǎng)首頁模板是怎么做的呢?今天小編抽時間給大家分享新手學(xué)習(xí)前端之js模仿淘寶主頁網(wǎng)站的相關(guān)資料,需要的朋友可以參考下2016-10-10
從數(shù)據(jù)庫讀取數(shù)據(jù)后將其輸出成html標簽的三種方法
需要輸出成html標簽時編譯器卻自動幫我們輸出成字符串,這該怎么辦?下面有個三個解決方法,一一測試便知其效果是如何2014-10-10
ASP中進行HTML數(shù)據(jù)及JS數(shù)據(jù)編碼函數(shù)
在有些時候我們無法控制亂碼的出現(xiàn), 比如發(fā)送郵件的時候有些郵件顯示亂碼, 比如Ajax返回數(shù)據(jù)總是亂碼. 怎么辦?2009-11-11
javascript跳轉(zhuǎn)與返回和刷新頁面的實例代碼
這篇文章主要介紹了javascript跳轉(zhuǎn)與返回和刷新頁面的實例代碼,簡單介紹了javascript中window.open()與window.location.href的區(qū)別,感興趣的朋友一起看看吧2019-11-11

