如何製作日誌邊框

06-16

如何製作日誌邊框1.在圖片上寫日誌效果：1.在圖片上寫日誌代碼說明：粉紅色地方「height=300」表示圖片的高度為300 黃色地方「width_=500」表示圖片的寬度為500 藍色地方「圖片地址」表示圖片屬性地址鮮綠色地方「border=3」表示為圖片加邊框為3（當設為0時只是簡單的圖片加字效果）青綠色地方「cellSpacing=3」表示為邊框格線設置距離為3（最佳數值1到6）注意：當邊框設為0時無效橙色地方「borderColor=#003333」表示邊框格線顏色，顏色碼是「003333」代碼：<TABLE borderColor=#003333 height=300 cellSpacing=3 cellPadding=0 width_=500 align=center style="BACKGROUND-IMAGE:url(圖片地址)"borderColor=#cccccc border=1><TBODY><TR><TD align=middle><P><FONT face=宋體 color=#ff0000 size=4><STRONG>添加文字或圖片</STRONG></FONT></P></TD></TR></TBODY></TABLE>2.用顏色碼製作簡單日誌邊框效果：2.用顏色碼製作簡單日誌邊框代碼說明：海綠色地方「borderColor=#FF0000」的「FF0000」表示邊框格線顏色碼紅色地方「height=300」的「300」表示邊框高度數值藍色地方「cellSpacing=0」的「0」表示格線的距離數值粉紅色地方「width_=500」的「500」表示邊框寬度數值鮮綠色地方「bgColor=#FFFFCC」的「FFFFCC」表示邊框內背景顏色碼青綠色地方「border=6」的「6」表示邊框格線厚度代碼：<TABLE borderColor=#FF0000 height=300 cellSpacing=0 cellPadding=0 width_=500 align=center bgColor=#FFFFCC border=6><TBODY><TR><TD align=middle><P><FONT face=宋體 color=#ff0000 size=4><STRONG>添加文字或圖片</STRONG></FONT></P></TD></TR></TBODY></TABLE>3.為圖片邊框加標題欄及背景效果：為圖片邊框加標題欄及背景代碼說明藍色地方「標題欄背景圖片地址」表示標題欄的背景圖片屬性地址橙色地方「height=38」的「38」表示標題欄的高度青綠色地方「日誌背景圖片地址」表示日誌背景圖片屬性地址粉紅色地方「height=250」表示日誌背景的高度本人認為無論是標題藍背景的高度還是日誌背景高度都無需太大的修改，因為兩者的高度都會隨文字的大小和數量增加，所以，只設初步就好。這樣在日誌目錄瀏覽中才不會顯得過大。代碼：<TABLE height=300 cellSpacing=2 cellPadding=0 width_=500 align=center border=2><TBODY><TR><TD align=middle style="BACKGROUND-IMAGE:url(標題欄背景圖片地址)"borderColor=#cccccc border=38><STRONG><FONT color=#ff0000 size=5>添加標題</FONT></STRONG></TD></TR><TR><TD align=middle style="BACKGROUND-IMAGE:url(日誌背景圖片地址)"borderColor=#cccccc border=250><P><FONT color=#ff00ff size=3>添加文字或圖片</FONT></P></TD></TR></TBODY></TABLE>4.為顏色邊框加標題欄及背景色效果：為顏色邊框加標題欄及背景色代碼說明粉紅色地方「borderColor=#FF0000」的「FF0000」表示邊框格線顏色碼橙色地方「bgColor=#FFFFCC」的「FFFFCC」表示日誌背景顏色碼綠色地方「bgColor=#FF0000」的「FF0000」表示標題欄顏色碼代碼：<<TABLE borderColor=#FF0000 height=300 cellSpacing=3 cellPadding=0 width_=500 align=center bgColor=#FFFFCC border=6><TBODY><TR><TD align=middle bgColor=#FF0000 height=38><FONT face=宋體 color=#FFFFFF size=5><STRONG>添加標題</STRONG></FONT></TD></TR><TR><TD align=middle height=250><FONT face=宋體 color=#222222 size=3><STRONG>添加文字或圖片</STRONG></FONT></TD></TR></TBODY></TABLE>5.圖片邊框加多層效果：圖片邊框加多層效果代碼說明 1.橙色地方表示第一層格線寬度藍色地方表示第一層背景圖片地址 2.粉紅色地方表示第二層格線寬度青綠色地方表示第二層背景圖片地址 3.紫羅蘭色地方表示第三層格線寬度鮮綠色地方表示第三層背景圖片地址 4.黃色地方表示日誌背景圖片地址值得注意的是，「值得注意的是，「 <TABLE borderColor=#000000 height=300 cellSpacing=20 cellPadding=0 width_=500 align=center style="BACKGROUND-IMAGE:url(邊框背景圖片地址)"borderColor=#cccccc border=1><TR><TD align=middle>其實就是表示邊框的一層代碼，如果要加多層就只需在所有代碼前加一段這個代碼就行，減少也是刪除這一段。代碼：<TABLE borderColor=#000000 height=300 cellSpacing=20 cellPadding=0 width_=500 align=center style="BACKGROUND-IMAGE:url(第一層邊框背景圖片地址)"borderColor=#cccccc border=1><TBODY><TR><TD align=middle><TABLE borderColor=#003366 height=300 cellSpacing=16 cellPadding=0 width_=500 align=center style="BACKGROUND-IMAGE:url(第二層邊框背景圖片地址)"borderColor=#cccccc border=1><TBODY><TR><TD align=middle><TABLE borderColor=#000000 height=300 cellSpacing=8 cellPadding=0 width_=500 align=center style="BACKGROUND-IMAGE:url(第三層邊框背景圖片地址)"borderColor=#cccccc border=1><TBODY><TR><TD align=middle><TABLE borderColor=#000000 height=300 cellSpacing=3 cellPadding=0 width_=500 align=center style="BACKGROUND-IMAGE:url(日誌背景圖片地址)"borderColor=#cccccc border=3><TBODY><TR><TD align=middle><P><FONT face=宋體 color=#ff0000 size=4><STRONG>添加文字或圖片</STRONG></FONT></P></TD></TR></TBODY></TABLE6.添加多層顏色框效果：添加多層顏色框代碼說明：藍色地方表示第一層邊框顏色代碼鮮綠色地方表示第二層邊框顏色代碼青綠色地方表示第三層邊框顏色代碼粉紅色地方表示日誌背景顏色添加一層或刪除一層代碼：「 <TABLE borderColor=#000000 height=300 cellSpacing=20 cellPadding=0 width_=500 align=center bgColor=#FF0000 border=1><TBODY><TR><TD align=middle>5.圖片邊框加多層的添加或刪除方法代碼：<TABLE borderColor=#000000 height=300 cellSpacing=20 cellPadding=0 width_=500 align=center bgColor=#FF0000 border=1><TBODY><TR><TD align=middle><TABLE borderColor=#FFFFFF height=300 cellSpacing=12 cellPadding=0 width_=500 align=center bgColor=#000000 border=1><TBODY><TR><TD align=middle><TABLE borderColor=#000000 height=300 cellSpacing=8 cellPadding=0 width_=500 align=center bgColor=#FF0000 border=1><TBODY><TR><TD align=middle><TABLE borderColor=#000000 height=300 cellSpacing=2 cellPadding=0 width_=500 align=center bgColor=#FFFFFF border=1><TBODY><TR><TD align=middle><P><FONT face=宋體 color=#ff0000 size=4><STRONG>添加文字或圖片</STRONG></FONT></P></TD></TR></TBODY></TABLE>製作素材：

底圖

HTML在線編輯器：http://ny.xmu.edu.cn/editor.asp風致嫣然講解錄像：

表格鏈接代碼：製作代碼1、表格中純圖片鏈接表格中的圖片鏈接代碼：<TABLE borderColor=#ff0000 cellSpacing=1 cellPadding=2 width_=570 bgColor=#60ffff border=2><TBODY><TR><TD width_="10%"><A href="網址" target=」_blank」><IMG src="圖片"></A></TD><TD width_="10%"><A href="網址" target=」_blank」><IMG src="圖片"></A></TD><TD width_="10%"><A href="網址" target=」_blank」><IMG src="圖片"></A></TD><TD width_="10%"><A href="網址" target=」_blank」><IMG src="圖片"></A></TD><TD width_="10%"><A href="網址" target=」_blank」><IMG src="圖片"></A></TD><TD width_="10%"><A href="網址" target=」_blank」><IMG src="圖片"></A></TD><TR><TD width_="10%"><A href="網址" target=」_blank」><IMG src="圖片"></A></TD><TD width_="10%"><A href="網址" target=」_blank」><IMG src="圖片"></A></TD><TD width_="10%"><A href="網址" target=」_blank」><IMG src="圖片"></A></TD><TD width_="10%"><A href="網址" target=」_blank」><IMG src="圖片"></A></TD><TD width_="10%"><A href="網址" target=」_blank」><IMG src="圖片"></A></TD><TD width_="10%"><A href="網址" target=」_blank」><IMG src="圖片"></A></TD><TR>2、純文字鏈接：表格中的文字鏈接代碼：<TABLE borderColor=#ff0000 cellSpacing=1 cellPadding=2 width_=570 bgColor=#60ffff border=2><TBODY><TR><TD width_="10%"><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><A href="網址" target=_blank>名稱</A></TD><TR><TD width_="10%"><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><A href="網址" target=_blank>名稱</A></TD><TR>3、圖文混合表格（文字鏈接）表格中的圖片上的文字鏈接代碼：<TABLE borderColor=#ff0000 cellSpacing=1 cellPadding=2 width_=570 bgColor=#60ffff border=2><TBODY><TR><TD width_="10%"><IMG src="圖片" border=0><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><IMG src="圖片" border=0><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><IMG src="圖片" border=0><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><IMG src="圖片" border=0><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><IMG src="圖片" border=0><A href="網址" target=_blank>名稱</A></TD><TR><TD width_="10%"><IMG src="圖片" border=0><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><IMG src="圖片" border=0><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><IMG src="圖片" border=0><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><IMG src="圖片" border=0><A href="網址" target=_blank>名稱</A></TD><TD width_="10%"><IMG src="圖片" border=0><A href="網址" target=_blank>名稱</A></TD><TR>☆夜月幽夢☆《專版導航》用IR給GIF動畫添加文字iSee圖片專家下載與簡單處理圖片一圖搞定全套自定義裝扮春朱自清（簡易音畫大圖製作教程示例）用PS製作音畫大圖日誌（6.1修改）用PS去掉圖片上的文字用PS扣圖拼圖製作簽名圖用PS做簡單閃圖閃字簽名對稱花邊框簡單的製作方法如何在圖片加播放器做邊框代碼詳解和邊框素材2如何用代碼做一篇日誌1如何在圖片中加入文字及百頁窗效果代碼QQ空間可用的基本代碼純代碼分割線及信紙的製作（附顏色代碼）信紙加邊框和背景的代碼元旦賀卡及製作方法如何製作邊框的代碼（附，顏色代碼大全）教你免費使用漂亮的黃鑽專用日誌信紙美圖秀秀(軟體)----不會PS的來看看哦清除迅雷5小廣告的方法新手用電腦必備160種色彩搭配組合專用表漂亮的閃光邊框（背景素材）漂亮的橫條邊框（背景素材）