博客文章色彩背景代碼

為了使自己的文章更有個性，可以把下面的代碼複製粘貼到文章的顯示源代碼區，在自定義文字裡面輸入你想寫的文字即可：<table width_=500style="filter: alpha(opacity=100,finishopacity=10,style=1);"><tr><td align=center bgcolor=顏色><PRE>在這裡輸入你的文字</PRE> </td></tr></table>bgcolor=skyblue（天藍色）bgcolor=red（紅色）bgcolor=purple（紫色）bgcolor=green（綠色）bgcolor=yellow（黃色）bgcolor=gold（金色）alpha是來設置透明度的,它的基本屬性是filter：alpha（opacity，finishopacity，style，startX，startY，finishX，finishY）.opacity代表透明度數,選值0-100,0是完全透明,100是不透明.finishopacity用來設置結束時的透明度,以達到漸變效果.取值範圍也是0-100.style指漸變類型,0是無變化,1是線行漸變,2是放射漸變,3是X型漸變.《解析HTML邊框》一、虛線邊框先來看一下代碼：<TABLE style="BORDER-RIGHT: #ff0000 3px dashed; BORDER-TOP: #ff0000 3px dashed; BORDER-LEFT: #ff0000 3px dashed; WIDTH: 691px; BORDER-BOTTOM: #ff0000 3px dashed; HEIGHT: 50px" cellSpacing=5 cellPadding=0 align=center bgColor=#ff0000><TBODY><TR><TD vAlign=center align=middle width_=60 bgColor=#0000ee height=30></TD></TR> </TBODY> </TABLE>邊框效果如下圖：

可能的參數值值描述none定義無邊框dotted點狀邊框dashed虛線邊框solid實線邊框double雙線邊框，雙線的寬度等於border-width的值。groove凹槽邊框其效果取決於border-color的值ridge壟狀邊框insetInset邊框outsetOutset邊框inherit規定從父元素繼承邊框樣式BORDER-RIGHT表示右邊框，BORDER-TOP表示頂邊框，BORDER-LEFT表示左邊框，BORDER-BOTTOM表示底邊框。二、點線邊框從可能的值中我們可以看到dashed是虛線邊框，我們將上面的dashed改為dotted看點狀邊框的效果。代碼：<TABLE style="BORDER-RIGHT: #ff0000 3pxdotted; BORDER-TOP: #ff0000 3pxdotted; BORDER-LEFT: #ff0000 3pxdotted; WIDTH: 691px; BORDER-BOTTOM: #ff0000 3pxdotted; HEIGHT: 50px" cellSpacing=5 cellPadding=0 align=center bgColor=#ff0000><TBODY><TR><TD vAlign=center align=middle width_=60 bgColor=#0000ee height=30></TD></TR> </TBODY> </TABLE>邊框效果如下圖：

三、3D壟狀邊框代碼：<TABLE style="BORDER-RIGHT: #ff0000 10pxridge; BORDER-TOP: #ff0000 10pxridge; BORDER-LEFT: #ff0000 10pxridge; WIDTH: 691px; BORDER-BOTTOM: #ff0000 10pxridge; HEIGHT: 50px" cellSpacing=5 cellPadding=0 align=center bgColor=#ff0000><TBODY><TR><TD vAlign=center align=middle width_=60 bgColor=#0000ee height=30></TD></TR> </TBODY> </TABLE>邊框效果如下圖：

四、3D凹槽邊框代碼：<TABLE style="BORDER-RIGHT: #ff0000 10pxgroove; BORDER-TOP: #ff0000 10pxgroove; BORDER-LEFT: #ff0000 10pxgroove; WIDTH: 691px; BORDER-BOTTOM: #ff0000 10pxgroove; HEIGHT: 50px" cellSpacing=5 cellPadding=0 align=center bgColor=#ff00ee><TBODY><TR><TD vAlign=center align=middle width_=60 bgColor=#0000ee height=30></TD></TR> </TBODY> </TABLE>邊框效果如下圖：

其他值我沒有試，總之改變邊框的屬性值即可以改變邊框的樣式。五、去掉內邊框時的虛線邊框代碼：<TABLE style="BORDER-RIGHT: #ff0000 3px dashed; BORDER-TOP: #ff0000 3px dashed; BORDER-LEFT: #ff0000 3px dashed; WIDTH: 691px; BORDER-BOTTOM: #ff0000 3px dashed; HEIGHT: 50px" ><TBODY><TR><TD vAlign=center align=middle width_=60 bgColor=#0000ee height=30></TD></TR> </TBODY> </TABLE>邊框效果如下圖：

代碼輸入可以在發博文時選中編輯窗口下面的「顯示源代碼」，然後輸入代碼，再取消「顯示源代碼」即可正常顯示。我們可以舉一反三的修改一下顏色、高度、寬度等試一試，很好玩的。六、關於插入文字的說明：我們看上面代碼的紅色部分，在「顯示源代碼」的編輯狀態下在「<TD vAlign=center align=middle width_=60 bgColor=#0000ee height=30>」後面輸入<p>然後輸入文字，打入</p>結束本行文字，然後</TD>這時文字就加入了，或在正常編輯狀態直接輸入文字即可。要讓文字居中請在<p>標籤中輸入align=center即是<palign=center>，看一下全部代碼：<TABLE style="BORDER-RIGHT: #ff0000 3px dashed; BORDER-TOP: #ff0000 3px dashed; BORDER-LEFT: #ff0000 3px dashed; WIDTH: 691px; BORDER-BOTTOM: #ff0000 3px dashed; HEIGHT: 50px" ><TBODY><TR><TD vAlign=center align=middlewidth_=690bgColor=#0000ee height=30><p align=center>這裡是文字</p></TD></TR> </TBODY> </TABLE>將上面的代碼在「顯示源代碼」時粘貼過去試一下，如果不居中有可能是段落寬度太小，修改一下上面代碼中的黃色數據就好了。七、其他需要說明的地方vAlign代表行的垂直對齊方式，等號後面是參數，center表示居中，top表示項部對齊，bottom表示下部對齊,baseline是基線對齊。align代表水平對齊方式，參數left是左對齊，right是右對齊，middle是水平居中對齊。給大家提供一個HTML學習的網頁希望大家喜歡。HTML語言-字體標題大小：<h#> 文字 </h#>#=1, 2, 3, 4, 5, 6文字大小：<font size=#> ... </font>#=1, 2, 3, 4, 5, 6, 7 or +#, -#<basefont size=#>#=1, 2, 3, 4, 5, 6, 7物理字體：加粗：<b>文字</b>斜體：<i>文字</i>加下劃線：<u>文字</u>垂直居中：<tt>文字</tt>垂直靠上：^文字垂直靠下：_文字加刪除線：<s>文字</s>加粗：文字斜體：文字加下劃線：文字垂直居中：文字垂直靠上：文字垂直靠下：文字加刪除線：文字文字顏色：<font color=#> 文字 </font>#=Black（黑色）, Red（紅色）, Blue（蘭色）, Yellow（黃色）也可以用顏色代碼。HTML語言-圖像鏈入圖像的基本語法：<img src=圖像地址>在瀏覽器尚未完全讀入圖像時，在圖像位置顯示的文字：<img src=圖像地址 alt=要顯示的文字>圖像和文字的對齊：<img src=圖像地址 align=#>文字<br>#=top（文字對齊圖像上沿）, middle（文字對齊居中圖像）, bottom（文字對齊圖像下沿）。圖像在頁面中的對齊/布局：<img src=圖像地址 align=#>文字<br>#=left（圖像在左文字在右）, right（文字在左圖像在右）。圖像在中，文字左右布局：文字<img src=圖像地址 hspace=圖像和文字左右間距值>文字圖像在中，文字上下布局：文字<br><img src=圖像地址 vspace=圖像和文字上下間距值><br>文字圖像邊框：<img src=圖像地址 border=邊框的粗細值>HTML語-排版【文字置左、置中、置右】1、使用方法：可以讓其整個文欄位落置左、置中或置右。2、解說：「align=對齊位置」它的功能是專門在設定「水平對齊位置」，其常見的設定值有三個，也就是置左（align="left"）、置中（align="center"）、置右（align="right"）。【置中標籤】1、使用方法：<center>內容</center>2、解說：除了文字，對於圖片、表格，任何可以顯現的都可以置中。【向右縮排標籤】1、使用方法：<blockquote>文字</blockquote>2、解說：利用<blockquote></blockquote>這個標籤可以將其包起來的文字，全部往右縮，而且加一組標籤，往右縮排一單位，加兩組標籤，往右縮排兩單位，依此類推。【保存原始格式標籤】1、使用方法：<pre>文字<pre>2、解說：利用<pre></pre>這個標籤可以將其包起來的文字排版、格式，原封不動的呈現出來。【分隔線標籤】1、使用方法：上一段文字內容<hr>下一段文字內容2、解說：利用<hr>這個標籤便可產生一條橫分隔線。普通分隔線<hr>有色分隔線<hr color="色碼">有寬度分隔線<hr width_="寬度">有厚度分隔線<hr size="厚度">
推薦閱讀：