国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 辦公 > Dreamweaver > 正文

Dreamweaver按鈕怎么添加立體陰影效果?

2024-09-12 12:29:19
字體:
來源:轉載
供稿:網友

Dreamweaver中想要制作一個立體陰影的按鈕,該怎么制作呢?下面我們就來看看詳細的教程。

1、首先用DW制作一個按鈕,可以參考下方引用經驗來制作。

2、然后我們在按鈕樣式中添加一個投影的代碼【box-shadow: 10px 10px  10px  #B00000;】數值分別代表左右距離、上下距離、陰影過度、陰影顏色。具體我們來了解下。

3、我們把第一個數值修改成0并保存后,刷新網頁可以看到效果,陰影從右下方向移動到了正下方。

4、我們把陰影過度數值改成0并保存后,刷新網頁可以看到陰影就沒有過度的特效了。

5、我們再把上下距離的數值修改成5px,可以看到陰影位置里按鈕更近一些了。

6、我們把左右距離、上下距離的數值設置為0,陰影過度設置為30px,保存網頁刷新后可以看到,按鈕四周有了陰影過度的效果。

7、我們把左右距離的數值設置為-5px,可以看到陰影移動到了按鈕的左側。

8、左右距離的數值為-5px保持不變,把上下距離的數值也設置為-5px,可以看到陰影到了按鈕的上方。

9、了解了代碼后,我們把陰影設置為【box-shadow: 0px 5px  0  #B00000;】,再添加一個鼠標經過后的陰影,就是如下效果啦。是不是有種立體按鈕的感覺呢?

以上就是Dreamweaver制作立體陰影按鈕的教程,希望大家喜歡,請繼續關注武林網。

相關推薦:

Dreamweaver中box shadow怎么添加陰影?

Dreamweaver文字怎么添加多個不同的陰影?

Dreamweaver怎么用CSS制作圓角按鈕?

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 东乌珠穆沁旗| 道孚县| 嘉定区| 姜堰市| 敖汉旗| 甘肃省| 八宿县| 濉溪县| 渭南市| 红河县| 邵阳县| 嫩江县| 南澳县| 景泰县| 双流县| 莎车县| 临洮县| 崇明县| 阳原县| 马山县| 兴山县| 崇左市| 正定县| 溧水县| 图片| 巴马| 农安县| 交城县| 庆城县| 苍梧县| 华容县| 寿阳县| 娄底市| 台南市| 华阴市| 双柏县| 清徐县| 丹凤县| 平和县| 邛崃市| 晴隆县|