CSS實例:通過定義漸變邊框給圖片加陰影

一般我們可以使用背景圖的方式給圖片添加陰影，但對于不固定尺寸的圖片如何實現呢？

我們可以采取“視覺欺騙大法”——定義漸變邊框來實現

代碼：

body {background:#2e334d;}

img {border:none;}

a.pic-shadow {display:inline-block;zoom:1;padding:1px;background:#262a3f;border:solid #2b3048 1px;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;}

a.pic-shadow img {padding:1px;background:#13151f;border:solid #1e2132 1px;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;}

border-radius:5px;

-moz-border-radius:5px;

-webkit-border-radius:5px;

上面這段定義是各標準瀏覽器中圓角定義，用以更專業地欺騙眼睛

顏色代碼可以在ps中做好外發光效果后拾取。

我上面的效果是[柔和]、[擴展0]、[大小5px]、[顏色#000]其余默認

當然了，特殊要求的話可以使用ie的濾鏡來實現更華麗的陰影

反對濾鏡主義者飄過……你們自己gg去相關閱讀:

Oracle教程：如何將數據文件移到新區

網頁常用特效整理：初級篇

Web分頁打印 細線表格+分頁打印之終極攻略

ASP遠程保存圖片

Linux平臺下文件的壓縮與解壓參數說明

VBS利用SendKeys輸入中文字符的方法

Windows7 不能打開.hlp文件問題解決

CSS技巧:網頁文字漸變效果

PHP語言在Web開發領域的編程優勢

HTML教程:收集的常用的HTML標簽(5)

asp.net 2.0中利用Ajax2.0實現JSON傳送大量頁面數據

javaScript window.event.keyCode 集合與測試方法

PHP 編碼規范-文件名

正則表達式模式修正符 比如/esi

總結

以上是生活随笔為你收集整理的php为图片添加渐变背景,HTML_CSS实例:通过定义渐变边框给图片加阴影，一般我们可以使用背景图的方 - phpStudy...的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。