用css使網頁圖片半透明(轉)
讓我先通俗的介紹一下css,css不屬於html,它屬於html的輔助語言,在沒有css之前,網頁是靜態的,但自從有了css 後,網頁製作的歷史就要重寫了,css能給網頁加入許多你想象不到的動態效果,這也是其中一點而已,因為css中有很多特效,例如我們今天講的利用css使圖片變透明。
也許你會問,GIF圖片不是能透明嗎?那幹嘛還那麼麻煩,嘿嘿,GIF是可以透明,但可以半透明麼?那很明顯是不行的,但css就可以。想學就跟我來。
如果是完全變透明,那麼它的意義不大,重要的是它可以令圖片半透明,嘿嘿,還不明白麼?既然是半透明,學過photoshop的人都應該知道,半透明瞭,就可以半遮半掩的顯示圖片下面的元素!我們利用這一點可以做很多效果哦,例如類似煙霧效果啦,當然,如果你肯動動腦筋,更精彩的效果可能都能做的出來。我們今天只討論如何在Dreamweaver 4中設定與使用這種特效。
Ok,我們現在開始,前提是你得開啟Dreamweaver 4,下面是設定步驟:沒用過這個工具?暈!快到 下載一個吧。
1:在Dreamweaver 4中點windowàcss styles(或按鍵盤的shift+f11),調出css styles視窗。
2:在css styles視窗中,單擊右下角的加號,彈出new style視窗。設定如圖:
4:在Dreamweaver 4選中你插入的圖。
5:用滑鼠單擊上圖3的指明處。
6:大功告成,你可以按鍵盤的f12來預覽了(注意,這種特效在編輯狀態下是不可見的,一定要預覽才可見。
怎麼樣,圖片是不是變的半透明瞭?這教程只起到拋磚引玉的作用,說到底還是要大家掌握了方法後能舉一反三
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/8225414/viewspace-957440/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- CSS 例項之翻轉圖片CSS
- CSS3圖片旋轉效果CSSS3
- Python應用開發——爬取網頁圖片Python網頁
- CSS 3半透明邊框CSS
- CSS例項:翻轉圖片、滾動圖片欄、開啟大門CSS
- 如何修改網頁文字或圖片?網頁
- 線上將網頁轉成PDF檔案\JPG圖片的工具網頁
- html頁面轉PDF、圖片操作記錄HTML
- 網頁小實驗——用canvas生成精靈動畫圖片網頁Canvas動畫
- python批量ppt轉圖片,pdf轉圖片,word轉圖片指令碼Python指令碼
- node:爬蟲爬取網頁圖片爬蟲網頁
- 如何給網頁上的圖片加密網頁加密
- 將網路圖片 轉化成bitmap
- 【圖片版】學習CSS網格佈局CSS
- CSS3滑鼠懸浮圖片前後翻轉CSSS3
- 用canvas生成圖片為頁面新增水印Canvas
- psd圖片不能在網頁上顯示網頁
- Chrome 獲取網頁顏色(文字、圖片)Chrome網頁
- C# 實現PPT 每一頁轉成圖片C#
- Java後臺Html轉圖片和獲取頁面屬性值,及圖片拼接JavaHTML
- 【圖片版】CSS網格佈局(Grid)完全教程CSS
- CSS背景圖片集中在同一個圖片CSS
- 圖片格式轉換,JPG圖片轉換成PDF
- CSS基礎篇–CSS3圖片翻轉動畫技術詳解CSSS3動畫
- pdf轉圖片
- ppt轉圖片
- CSS · 兩種背景圖片CSS
- CSS圖片濾鏡灰度CSS
- 圖片輪播--純cssCSS
- CSS圓形圖片效果CSS
- CSS 來佈局圖片CSS
- 網頁中的圖片預覽思路(純前端)網頁前端
- 圖片怎麼轉換成PDF,圖片轉PDF教程
- 開源圖片工具箱(Img Toolbox) 格式轉換 新增水印 圖片壓縮 圖片裁剪 圖片旋轉 圖片縮放
- 網頁設計內容網頁中關於圖片預覽的設計網頁
- WKWebView 獲取網頁高度,圖片點選檢視,網頁連結點選WebView網頁
- 圖片抓取_千圖網圖片抓取
- ugui 縮放圖片使圖片的四個角和四邊保持原樣UGUI
- java 爬取網頁內容。 標題、圖片等Java網頁