|
★彩色背景代碼★ <div style="width:100%;height:100%;background-color:#ffb6c1;">文字</div> 注意,這里需要將<p></p>嵌套在這一語句中,即如下形式: <div style="width:100%;height:100%;background-color:#ffb6c1;"><p>文字</p></div> 當(dāng)你想更改不同色彩的時(shí)候,只需將#ffb6c1這個(gè)顏色編碼的數(shù)值加以調(diào)整就行了(注意不要丟了這個(gè)符號#)。效果如粉紅色區(qū)域顯示。
★圖片代碼★
<IMG height=50 src=圖片的地址 width=60>
★背景音樂代碼★
<IMG height=0 loop=infinite dynsrc=音樂的網(wǎng)址 width=0 border=0>
★視頻代碼★
<IMG height=240px width=320px loop=infinite dynsrc=流媒體文件鏈接>
★彩色邊框代碼★ <div STYLE="border-style:solid;border-width:5pt; border-color:red">日志文字</div> 它會在你的文字外圍生成一個(gè)紅色邊框,效果如框內(nèi)顯示。 border-style則控制邊框的效果 border-width控制邊框的粗細(xì), border-color調(diào)整邊框的顏色, 這里你仍然可以使用如#xxxxxx的顏色數(shù)值,而當(dāng)使用“solid”則為單一顏色的線形簡單邊框。
<DIV style="BORDER-RIGHT: #ff4500 4px solid; BORDER-TOP: #ff4500 4px solid; BORDER-LEFT: #ff4500 4px solid; BORDER-BOTTOM: #ff4500 4px solid; BACKGROUND-COLOR: #ffdead">實(shí)線</DIV>
★雙線框代碼★ <div STYLE="border-style:Double;border-width:8pt; border-color: #8B008B"> 效果如框內(nèi),是帶背景色(熏衣草色)的簡單雙線框。
<div STYLE="border-style:Double;border-width:6pt; border-color: #ff4500"> 顯示的效果是背景色為桃色的簡單雙線框。效果如框內(nèi)所示,邊框的顏色是橙紅色#ff4500,框內(nèi)背景色為桃色#ffdab9。 <div STYLE="border-style:Double;border-width:6pt; border-color: #ff4500"> 顯示的效果是背景色為NAVAJO白的簡單雙線框。效果如框內(nèi)所示,邊框的顏色是橙紅色#ff4500,框內(nèi)背景色為桃色#ffdead。 <div STYLE="border-style:Double;border-width:6pt; border-color: #ff4500"> 背景顏色為淡黃色#FFFFE0,效果如框內(nèi)所示。 <div STYLE="border-style:Double;border-width:6pt; border-color: #f08080"> 這種雙線框的效果有若隱若現(xiàn)的感覺,框的顏色是淡珊瑚色#f08080,框內(nèi)背景的顏色是NAVAJO白#FFdead。效果如框內(nèi)所示。 <div STYLE="border-style:Double;border-width:6pt; border-color: #f08080"> 這種雙線框的效果有若隱若現(xiàn)的感覺,框的顏色是淡珊瑚色#f08080,框內(nèi)背景的顏色是淡黃色#FFFFE0。效果如框內(nèi)所示。
★立體線框代碼★ <div style= "border-top-style:Ridge;border-right-style:Ridge;border-left-style:Ridge; 效果如框內(nèi)所示,是帶背景色(熏衣草色)的浮出立體線框,代碼中的#E6E6FA是背景的顏色(熏衣草色)
<DIV style="BORDER-RIGHT: 5pt ridge; BORDER-TOP: 5pt ridge; BORDER-LEFT: 5pt ridge; BORDER-BOTTOM: 5pt ridge; BACKGROUND-COLOR: #a0522d"> 背景為粉紅色,效果如框內(nèi)所示。 <DIV style="BORDER-RIGHT: 5pt ridge; BORDER-TOP: 5pt ridge; BORDER-LEFT: 5pt ridge; BORDER-BOTTOM: 5pt ridge; BACKGROUND-COLOR: #a0522d"> 背景為桃色,效果如框內(nèi)所示。
立體效果的彩色邊框是在border-style后面使用不同的語法描述: Solid 簡單線形邊框 Double 簡單雙線邊框 Groove 溝線立體效果邊框 Ridge 脊線立體效果邊框 Inset 嵌入線立體效果邊框 Outset 浮出線立體效果邊框。 <div STYLE="border-style:outset;border-width:2pt; border-color: red"> 使用上述語法將會為你呈現(xiàn)一個(gè)NAVAJO白底色紅邊框的浮出線效果背景,效果如框內(nèi)顯示。 <div STYLE="border-style:outset;border-width:3pt; border-color: red"> 顯示的效果是背景色為桃色的立體線框。效果如框內(nèi)所示,框內(nèi)背景色為桃色#ffdab9。
對于背景邊框的四個(gè)邊你也可以按自己的需要進(jìn)行調(diào)整,以左邊框?yàn)槔憧梢允褂孟率稣Z法: Border-left-style:solid (double, groove, ridge, inset, outset)定制邊框樣式
<div style= "border-top-style:outset;border-right-style:outset;border-left-style:outset; 你可以按照自己的想法隨意調(diào)整四個(gè)邊框的式樣,以便創(chuàng)造與眾不同的效果,記住一點(diǎn),不同的屬性描述之間用 ; 隔開。另外,你可能會注意到,當(dāng)你設(shè)置完邊框返回到日志文本編輯模式,在鍵入文字過程中如果使用回車鍵,就會又出現(xiàn)一個(gè)邊框,從而影響文字的連貫性,這是因?yàn)镠TML語法中不支持硬回車。要解決這個(gè)問題,必須返回到HTML編輯模式,在需要回車的地方鍵入<br>,需要幾次回車就鍵入幾個(gè)<br>,然后再返回到文本編輯模式,你就會發(fā)現(xiàn)邊框背景內(nèi)已經(jīng)為你加入了回車后的效果。
★滾動文本框代碼★ 把代碼拷貝后可直接雙擊文本框就可以在里面輸入文字和粘貼圖片,而且文本框的大小可以隨意調(diào)整。 <DIV align=center 代碼實(shí)現(xiàn)的文本框是淺黃色的背景,粗略效果如文本框內(nèi)所示。 (注釋:附語法語句的解釋: //層開始標(biāo)記,對中對齊
★文字豎排代碼★ 接下來說說文字豎排是如何實(shí)現(xiàn)的。除了制造特殊效果,我在Space空間展示的文字豎排沒有什么真正的實(shí)用性,只會給閱讀者造成麻煩,不過本著盡可能挖掘Space潛力的原則,我還是嘗試了如下的語法: <DIV style="FONT-SIZE: 9pt; WRITING-MODE: tb-rl; TEXT-ALIGN: left"><p>日志文字</P></DIV> 這個(gè)語法中唯一的亮點(diǎn)就是Writing-Mode這個(gè)參數(shù),其后的tb代表文字排列從上到下,rl代表從右到左;
★實(shí)線、雙線、外凸、虛線代碼★ 美化您的網(wǎng)絡(luò)日志-強(qiáng)調(diào)顯示 <font style="BACKGROUND-COLOR:#FF00000" color="#FFFFFF">...</font> style="BACKGROUND-COLOR:#FF00000:底色-紅色
美化您的網(wǎng)絡(luò)日志-加線框 <div style="border: 1px dashed #000000;background-color:#FFFFE0"> ... </div> 1px:框線寬度- 1 點(diǎn)
<div style="border:1px solid #000000;">實(shí)線</div>
<div style="border: 1px dashed #f08080;background-color:#ffdab9">文字</div> <div style="border: 3px dashed #ff4500;background-color:#ffdab9">文字</div> <div style="border: 3px dashed #f08080;background-color:#FFFFE0">文字</div>
<div style="border-style:outset #ffdab9;background-color:#FFFFE0; border-width:3px;">外凸</div> ★文字效果代碼★ 陰影效果的代碼:<FONT style="FONT-SIZE: 20pt; FILTER: shadow(color=black); WIDTH: 100%; FONT-FAMILY: 華文彩云" color=#66cc99><B>陰影效果</B></FONT>
發(fā)光效果的代碼:<FONT style="FONT-SIZE: 20pt; FILTER: glow(color=black); WIDTH: 100%; FONT-FAMILY: 華文彩云" color=#ff3366><B>發(fā)光效果</B></FONT>
模糊效果的代碼:<FONT style="FONT-WEIGHT: bolder; FONT-SIZE: 30px; FILTER: blur(add=1, direction=40,strength=10); WIDTH: 200px" color=#9900ff>模糊效果</FONT>
光暈效果的代碼:<DIV style="FILTER: glow(color=#ff6600,strength=6); COLOR: #000000; HEIGHT: 10px"><FONT size=6>光暈效果</FONT></DIV>
★郵票效果代碼★
★文繞圖代碼★ 美化您的網(wǎng)絡(luò)日志-文繞圖 <img src="..." align="right"> align="left":圖靠左 ************************************************************************* 圖靠左:<IMG src="http:///QTZY/GIF/xsgs/xsgs441.gif" align=left>
文繞圖 ★背景圖片代碼★
★發(fā)亮文字代碼★ 效果:你所要顯示的文字 ABCDEFG 世界和平 無 |
|
|