如何不用圖片地址做邊框的方法?
一、不引用圖片地址做邊框的代碼:
首先看一下效果圖,如下:
這里是文字的輸入地方,隨著文字的增多,邊框就逐漸放大??梢苑偶尤氡尘皥D片的代碼 ,
在這里還可以放一個或多個動畫代碼(做多層透明flash動畫)。
代碼如下:
<TABLE style="BORDER-RIGHT: #FF0000 10px ridge; BORDER-TOP: #00ff00 10px ridge; BORDER-LEFT: #0000ff 10px ridge; BORDER-BOTTOM: #CC00ff 10px ridge; BACKGROUND-COLOR: #0099ff" cellSpacing=0>
<TBODY>
<TR>
<TD>
這里是文字的輸入地方,隨著文字的增多,邊框就逐漸放大??梢苑偶尤氡尘皥D片的代碼 ,在這里還可以放一個或多個動畫代碼(做多層透明flash動畫)。
</TD></TR></TBODY></TABLE>
說明:
<1>: (上、下、左、右邊框的取色)紅色代碼是右邊框;綠色代碼是上邊框;深藍(lán)色代碼是左邊框;桃紅色代碼是下邊框;
<2>:天藍(lán)色代碼是邊框內(nèi)面背景顏色;黃色代碼cellSpacing=0是限制內(nèi)邊框與外邊框距離的,“0”表示沒有距離.(可根據(jù)需要,適當(dāng)修改其數(shù)據(jù))
<3>:邊框顏色的取色,要根據(jù)你的需要而選取不同的顏色.找到代碼中的 # 號后面的000000便是顏色代碼,'00000'為黑色代碼.顏色的選用,請叁見:
《顏色代碼大全》一文.(點(diǎn)擊下列表格中的文章)
《顏色代碼大全》<4>:要想使四面邊框顏色統(tǒng)一,只需將 # 號后面的'000000'全部變?yōu)橥活伾a即可.10px是表示外邊框的寬度,數(shù)值同樣可以適當(dāng)修改.
<5>:這段代碼中沒有內(nèi)邊框代碼,所以稱之為:一層邊框或單層背景邊框.
二、多層邊框的制作方法:(二層邊框)
上面講的是一層即單層邊框的制作方法.那么該怎樣給單層邊框加多層內(nèi)邊框呢?
先看下面代碼:(二層邊框)
<TABLE style="BORDER-RIGHT: #00ff00 10px ridge; BORDER-TOP: #00ff00 10px ridge;
BORDER-LEFT: #00ff00 10px ridge; BORDER-BOTTOM: #00ff00 10px ridge;
BACKGROUND-COLOR: #ff0000" cellSpacing=0>
<TBODY>
<TR>
<TD>
<TABLE border=1>
<TBODY>
<TR>
<TD>
這里是文字的輸入地方,隨著文字的增多,邊框就逐漸放大??梢苑偶尤氡尘皥D片的代碼 ,在這里還可以放一個或多個動畫代碼(做多層透明flash動畫)。
</TD></TR></TBODY></TABLE>
說明:
<1>:黑色處為單層邊框代碼. 綠色處為多層邊框開頭的必加代碼,把它放在單層代碼后面;
<2>:蘭色處即為內(nèi)層邊框,其中 border=1表示內(nèi)邊框的粗、細(xì),可在1-6之間選擇.數(shù)值過大,邊框就會顯得過粗而影響美觀;cellSpacing=0表示內(nèi)外邊框間的距離;
<3>:此代碼為二層邊框代碼,看它的效果圖如下:
這里是文字的輸入地方,隨著文字的增多,邊框就逐漸放大??梢苑偶尤氡尘皥D片的
代碼 ,在這里還可以放一個或多個動畫代碼(做多層透明flash動畫)。
<4>:如將上面代碼中的border=1、cellSpacing=0數(shù)值修改為;border=4、cellSpacing=6后,看到的效果圖如下:
這里是文字的輸入地方,隨著文字的增多,邊框就逐漸放大。可以放加入背景圖片
的代碼 ,在這里還可以放一個或多個動畫代碼(做多層透明flash動畫)。
<5>:如果想做三、四或多層邊框,只需采用復(fù)制粘貼上面代碼中碼蘭色處即可.現(xiàn)在我以四層邊框為例:
看代碼:
<TABLE style="BORDER-RIGHT: #00ff00 10px ridge; BORDER-TOP: #00ff00 10px ridge;
BORDER-LEFT: #00ff00 10px ridge; BORDER-BOTTOM: #00ff00 10px ridge;
BACKGROUND-COLOR: #ff0000" cellSpacing=0>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=0 border=1>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=0 border=1>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=0 border=1>
<TBODY>
<TR>
<TD>
<TABLE cellSpacing=0 border=1>
<TBODY>
<TR>
<TD>
這里是文字的輸入地方,隨著文字的增多,邊框就逐漸放大。可以放加入背景圖片的代碼 ,在這里還可以放一個或多個動畫代碼(做多層透明flash動畫)。
</TD></TR></TBODY></TABLE>
說明:cellSpacing=0和上面同樣表示內(nèi)邊框與內(nèi)邊之間的距離 border=1表示里層各邊框的粗、細(xì)度.
看它的效果圖如不:(該效果圖中的cellSpacing=0、border=1數(shù)據(jù)本人己作了修改)
這里是文字的輸入地方,隨著文字的增多,邊框就逐漸放大??梢苑偶尤氡尘皥D片
的代碼 ,在這里還可以放一個或多個動畫代碼(做多層透明flash動畫)。
以上就是不用圖片地址,來做簡易邊框的方法.
許多朋友看了這篇文章后,留言問我:
<1>:看到別人家博客里許多靜、動態(tài)的邊框是如何制作的?
<2>:音畫、圖片等是怎樣添加的呢?
有關(guān)這方面的制作,請叁見本人的:
"邊框"的制作方法及技巧
◇怎樣改變邊框顏色及邊框線數(shù)值◇ ◇邊框內(nèi)層背景顏色的替換方法◇