免费视频淫片aa毛片_日韩高清在线亚洲专区vr_日韩大片免费观看视频播放_亚洲欧美国产精品完整版

打開APP
userphoto
未登錄

開通VIP,暢享免費電子書等14項超值服

開通VIP
在網(wǎng)頁上制作精美的“立體表格”
表格是網(wǎng)頁內應用較多的東東,但一般我們只是用它來定位網(wǎng)頁中的模塊和排版文字。其實表格用好了還可以做出很多漂亮的效果,如圖一,承載文字的表格有一種看似立體的感覺。下面就來介紹一下這種立體表格的制作方法。


圖一

  表格有立體的感覺的全是因為在表格的右邊和下邊有淺黑色的陰影。所以我們只要實現(xiàn)了陰影就可以實現(xiàn)這種效果。現(xiàn)在我們就開始具體講述制作過程。在Frontpage2000中新建一個表格,選擇菜單“表格”-“屬性”-“表格”,在窗口內將表格的寬度設置為150象素;高度設置為200象素;邊框粗細設置為0;將單元格邊距設置為0,而單元格間距為1,如圖二所示。


圖二

  完成以上設置后將表格的背景色設置為黑色,但表格內的單元格的背景色設置為白色,完成以后就回出現(xiàn)如圖三所示的單象素黑色邊框效果。


圖三

  接下來的工作就是要為右邊和下邊的黑色邊框制作陰影,我們使用CSS樣式的功能來實現(xiàn)。在圖二所示的選項窗口內點擊“樣式”按鈕繼續(xù)選擇“格式”-“邊框”。在邊框與陰影選項框內,分別將樣式選擇為“實線”;顏色選擇為“灰色”;并在預覽選項內將下邊和右邊的邊框應用按鈕選中,如圖四所示。


圖四

  點擊“預覽”,你要的立體表格效果就出來了。(注明:我們在制作出來的最終效果可能和圖一所示略有出入,這是因為我們首先制作出了如圖三的單象素黑色邊框,這樣做的效果會更明顯,更有立體感。)

  在這里我們還給出在Dreamweaver內定義的樣式代碼,因為Frontpage和Dreamweaver的代碼機制有差別,相對之下Dreamweaver對樣式代碼寫得更規(guī)范更合理。表格代碼如下:

<TABLE width="150" height="200" cellpadding="0" cellspacing="1" bgcolor="#000000" style="border-right-width:2px;border-bottom-width :2px;border-right-style : solid;border-bottom-style : solid;border-right-color : #a7a7a7;border-bottom-color : #a7a7a7;">

  其中style以后的為樣式代碼“border-right-width”和“border-bottom-width”以后的2px代表陰影邊框的寬度為2象素,border-right-color和border-bottom-color以后的#a7a7a7代表陰影線框的顏色代碼,你也可以使用其他的顏色代碼替換(具體請參照HTML顏色表)。試著自己改變一下,根據(jù)你的需要制作效果。

本站僅提供存儲服務,所有內容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權內容,請點擊舉報。
打開APP,閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
代碼入門6 表格常用屬性
【顏色邊框】五款圖片顏色邊框的代碼
水中花【邊框+文字豎列特效】 -
設計邊框的代碼
立體彩色邊框代碼之制作閃動邊框的代碼
學代碼一
更多類似文章 >>
生活服務
分享 收藏 導長圖 關注 下載文章
綁定賬號成功
后續(xù)可登錄賬號暢享VIP特權!
如果VIP功能使用有故障,
可點擊這里聯(lián)系客服!

聯(lián)系客服