[06/29][傻兔教室]幾 種 實 用 邊 框 制 作

月儿

由 最 基 本 開 始 , 一 個 框(即 一 個 < TABLE>) (因 為 要 方 便 大 家 看 清 楚 , 因 此 所 用 數 值 比 較 誇 張 , 大 家 運 用 時 可 要 重 新 設 置 , 否 則 效 果 自 負 , 呵 呵 ~~~~) <TABLE background=http://i17.photobucket.com/albums/b51/lyh_/MATERIAL/set/e105606c.jpg border=7 bordercolor=#777777 cellpadding=15 cellspacing=45><TBODY><TR><TD><IMG src=http://i17.photobucket.com/albums/b51/lyh_/lovers%20N%20kiss/lover-38.jpg border=0 width=500></TD></TR></TBODY></TABLE> 加 點 變 化 , 剛 才 < TD> 里 是 空 白 的 , 現 在 在 < TD background=背景地址>里 插 入 另 一 個 背 景. 看 效 果 圖 :

月儿

再 來 是 兩 層 框 框 的 .. **框 框 可 自 設 width 和 height, 也 可 因 應 圖 片 尺 寸設 定, cellpadding, cellspacing 由 系 統 默 認 ** <TABLE background=http://i17.photobucket.com/albums/b51/lyh_/MATERIAL/set/8efa68fe.jpg border=15 bordercolor=#777777 cellpadding=15 cellspacing=45><TBODY><TR><TD> <TABLE background=http://i17.photobucket.com/albums/b51/lyh_/MATERIAL/set/8efa68fe.jpg border=1 bordercolor=#777777 cellpadding=15 cellspacing=45><TBODY><TR><TD> <IMG width=500 src=http://i17.photobucket.com/albums/b51/lyh_/lovers%20N%20kiss/lover-38.jpg border=0> </TD></TR></TBODY></TABLE> </TD></TR></TBODY></TABLE><BR> **說 明 : 看 起 來 好 像 是 用 了 四 層 表 格 , 其 實 只 用 了 兩 層 , 同 一 個 背 景 圖 , 主 要 是 邊 框 各 光 和 背 光 部 分 的 顏 色 應 用 起 來 的 效 果 . 也 可 嘗 試 在 表 格 里 < TD>內 插 入 background, 看 看 出 現 什 么 效 果 …

[ 本帖最后由 月儿 于 2006-6-29 20:07 编辑 ]

月儿

這 種 效 果 其 實 有 好 幾 種 方 法 做 出 來 , 但 是 在 我 認 為 這 是 最 簡 單 的 , 只 要 金 色 背 景 那 層 (第 二 層) 表 格 的 寬 是 100% 其 它 屬 性 值 一 律 為 0. 主 要 是 在 第 三 層 , 第 三 層 的 寬 width 的 取 值 要 是 99%, 而 第 三 層 的 td 里 的 width 屬 性 要 是 100%. <table align="center" border="0" cellpadding="0" cellspacing="10" width="620" background="http://i17.photobucket.com/albums/b51/lyh_/MATERIAL/set/8efa68fe.jpg"><tbody><tr><td width="100%" align="center"> <table align="center" border="0" cellpadding="0" cellspacing="0" width="90%" background="http://i17.photobucket.com/albums/b51/lyh_/MATERIAL/set/749f22d1.gif"><tbody><tr><td width="100%" align="center"> <table align="center" border="0" cellpadding="0" cellspacing="0" width="99%" background=http://i17.photobucket.com/albums/b51/lyh_/MATERIAL/set/8efa68fe.jpg><tbody><tr><td width="100%" align="center"> <img width=500 src=http://i17.photobucket.com/albums/b51/lyh_/lovers%20N%20kiss/lover-38.jpg border=0> </td></tr></tbody></table> </td></tr></tbody></table> </td></tr></tbody></table>

brjsj

月儿 你的硬盘是块宝藏！

绯舞

非常形象生动 易懂易学

月儿

這 個 沒 什 么 特 別 , 就 是 把 四 個 角 的 框 架 用 表 格 分 開 <table align="center" border="1" cellpadding="20" cellspacing="5" background="http://i17.photobucket.com/albums/b51/lyh_/MATERIAL/set/8efa68fe.jpg"><TBODY><tr><td width="100%" align="center"> <table align="center" border="0" cellpadding="0" cellspacing="0" width="680" background="http://i17.photobucket.com/albums/b51/lyh_/MATERIAL/set/8efa68fe.jpg"><TBODY><tr><td width="100%" align="center"> <TABLE cellSpacing=0 cellPadding=0 width="100%" align=center border=0><TBODY><TR> <TD width="50%" align=left><img border="0" width=100 src="左上框"></TD> <TD width="50%" align=right><img border="0" width=100 src="右上框"></TD> </TR></TBODY></TABLE> <img width=500 src=圖片地址 border=0> <TABLE cellSpacing=0 cellPadding=0 width="100%" align=center border=0><TBODY><TR> <TD width="50%" align=left><img border="0" width=100 src="左下框"></TD> <TD width="50%" align=right><img border="0" width=100 src="右下框"></TD> </TR></TBODY></TABLE> </td></tr></TBODY></table> </td></tr></TBODY></table>

月儿

把 圖 片 應 用 到 邊 框 上 面 , 整 個 表 格 的 大 小 很 重 要 的 . 調 整 也 是 件 頗 費 時 的 事 情 , 所 以 建 議 大 家 在 用 表 格 格 線 (厚 度) cellspacing 的 屬 性 值 或 是 表 格 格 線 (間 距) cellpadding 的 屬 性 值 來 調 整, 這 方 法 比 較 容 易 掌 控 . <center> <table align="center" border="1" cellpadding="0" cellspacing="40" background="http://i17.photobucket.com/albums/b51/lyh_/MATERIAL/set/e105606c.jpg" bordercolorlight="#C0B4FE" bordercolordark="#0C091D"> <tbody> <tr> <td width="100%" align="center"> <table align="center" border="1" cellpadding="0" cellspacing="18" width="100%" background="http://i17.photobucket.com/albums/b51/lyh_/MATERIAL/golden/c009cc02.jpg" bordercolor="#C0B4FE"> <tbody> <tr> <td width="100%" align="center"> <table align="center" border="0" cellpadding="18" cellspacing="0" width="100%" background="http://i17.photobucket.com/albums/b51/lyh_/MATERIAL/set/302e25a6.jpg"> <tbody> <tr> <td width="100%" align="center"> <img width=500 src=http://i17.photobucket.com/albums/b51/lyh_/lovers%20N%20kiss/lover-38.jpg border=0> </td></tr></tbody></table> </td></tr></tbody></table> </td></tr></tbody></table> </center>

不弃

嘿嘿.... 谢谢了.... 老师们...

爱在雨天

月儿

期 待 大 家 的 功 課 啊 !!
不要 再 猶 疑 了 ..
要 快 啊 ~~~~~~~~