學習Dreamweaver網(wǎng)頁設計的同學，有時候想讓一個DIV實現(xiàn)背景半透明效果，是怎么做到的呢？ 首先我們新建一個html文件，添加一個DIV，設置寬度和高度，以及背景色填充為紅色。 然后在父級

學習Dreamweaver網(wǎng)頁設計的同學，有時候想讓一個DIV實現(xiàn)背景半透明效果，是怎么做到的呢？

首先我們新建一個html文件，添加一個DIV，設置寬度和高度，以及背景色填充為紅色。

然后在父級DIV中插入一個子DIV，定義它的寬高，以及背景色（background：#fff;）。

然后我們添加一個透明度的代碼（opacity:0.6），保存后我們預覽下效果，背景已經(jīng)實現(xiàn)透明了，但是文字也透明了。那這個0.6是什么意思呢？

熟悉PS的同學應該都知道，在圖層的上方，有個不透明度，我們把PS中圖層不透明度設置為60%，就和網(wǎng)頁中的效果一樣了。對咯，他們就是一個數(shù)值。

但有的朋友不希望都透明。那我們怎么能讓背景透明，文字不透明呢？我們可以把剛才的背景色和不透明度代碼刪除，換個代碼【background-color:rgba(255,255,255,0.6);】，保存后我們看下效果，已經(jīng)變成了背景透明，文字不透明啦。

其中255,255,255就是PS中的拾色器里的數(shù)值啦，我想很多朋友應該就知道了。0.6同第一種方式是一個含義哦，現(xiàn)在朋友都會了吧？其實很簡單的呢。

如何在CSS中定義背景色透明而文字不透明

學習Dreamweaver網(wǎng)頁設計的同學，有時候想讓一個DIV實現(xiàn)背景半透明效果，是怎么做到的呢？

首先我們需要新建一個HTML文件，并在其中添加一個DIV元素。設置該DIV的寬度、高度以及背景色填充為紅色。

接下來，在父級DIV中插入一個子DIV，并定義它的寬度、高度以及背景色（background：#fff;）。

然后，我們?yōu)樽覦IV添加一個透明度的代碼（opacity:0.6）。保存后，我們可以預覽效果。背景已經(jīng)實現(xiàn)了透明效果，但是文字也變得透明了。那這個0.6是什么意思呢？

熟悉Photoshop的同學應該都知道，在圖層面板的上方，有一個不透明度選項。如果我們將PS中圖層的不透明度設置為60%，就可以達到與網(wǎng)頁中效果相同的效果。對了，它們其實是一個數(shù)值。

但是有些朋友可能并不希望同時讓背景和文字都變得透明。那么我們該如何才能讓背景透明而文字保持不透明呢？我們可以將之前的背景色和透明度的代碼刪除，并替換成另一行代碼【background-color:rgba(255,255,255,0.6);】。保存后，我們再次查看效果，背景已經(jīng)變得透明，而文字則保持不透明。

其中的255,255,255代表了PS中的拾色器中的數(shù)值，這應該是很多朋友都知道的。0.6和第一種方式具有相同的含義哦！現(xiàn)在大家應該都明白了吧？其實它非常簡單。