網站首頁 健康小知識 母嬰教育 起名 運動知識 職場理財 情感生活 綠色生活 遊戲數碼 美容 特色美食 愛好

CSS設定DIV背景色漸變顯示

欄目: 網際網路 / 釋出於: / 人氣:2.65W

操作方法

開啟軟體
可以使用Dreamweaver或Visual studio軟體,比如開啟VS軟體,如下圖所示:

CSS設定DIV背景色漸變顯示

建立一個DIV
然後在body主體中建立一個div名為【a】, <div class="a">DIV</div>,如下圖所示:

CSS設定DIV背景色漸變顯示 第2張

設定屬性
然後設定div的屬性,比如高度、寬度和顏色等等,如下圖所示:

CSS設定DIV背景色漸變顯示 第3張

背景漸變色
然後設定背景漸變色,程式碼如下圖:
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#0000ff));
其中:linear-gradient()是用來建立線性漸變的語句

CSS設定DIV背景色漸變顯示 第4張

預覽效果
點選預覽圖示,在瀏覽器中的顯示效果圖如下所示:

CSS設定DIV背景色漸變顯示 第5張
CSS設定DIV背景色漸變顯示 第6張