琳達教學:如何自製表格 初級班

 

很多人問琳達表格語法該如何設定自己所想要的格式
什麼又是 TABLE 表格??表格又該使用在什麼地方??
其實表格的功能很多,可以是文章框(單一表格)、是目錄分類(列表式表格)、是圖文解說(多重表格)....等等~

單一表格語法和表格預覽如下

 

<TABLE BORDER=3>
<TR>
<TD>語法內文貼於此</TD></TR>
</TABLE>

 


TABLE 是表格的意思;BORDER=3 是表格框線,可更改紅底白字的數字,數字愈大外框線就愈寬
<TR>是橫向表格的開始;</TR>是橫向表格的結束
<TD>是設定表格欄位的開始 </TD>是表格欄位的結束
是否發現了,只要有一個<TR>最後面一定配了一個</TR>

又例如二個欄位表格預覽

 

內文貼於此一 內文貼於此二

 

二欄位表格語法如下:

 

<TABLE BORDER=2>
<TR><TD>內文貼於此一</TD><TD>內文貼於此二</TD></TR>
</TABLE>

 

多了一個欄位就多增加了紅底白字的部份

相對的三個欄位表格預覽

 

內文貼於此一 內文貼於此二 內文貼於此三

 

三欄位表格語法如下:

 

<TABLE BORDER=1>
<TR><TD>內文貼於此一</TD><TD>內文貼於此二</TD><TD>內文貼於此三</TD></TR>
</TABLE>

 


示範了三個欄位樣式,是否看出了端倪呢??

接下來的是單一欄位,二列式表格預覽如下

 

內文貼於此A
內文貼於此B

 

單一欄位二列式表格語法如下

 

<TABLE BORDER=3>
<TR>
<TD>內文貼於此A</TD></TR>
<TR>
<TD>內文貼於此B</TD></TR>

</TABLE>

 

看到了嗎?二列式多了一組的<TR></TR>

二個欄位二列式表格預覽如下

 

內文貼於此A1 內文貼於此A2
內文貼於此A3 內文貼於此A4

 

二欄二列表格語法如下

 

<TABLE BORDER=2>
<TR>
<TD>內文貼於此A1</TD>
<TD>內文貼於此A2</TD></TR>
<TR>
<TD>內文貼於此A3</TD>
<TD>內文貼於此A4</TD></TR>
</TABLE>

 

找看看和二欄位的語法多出了什麼呀~

現在你可知道三欄位二列式表格語法嗎??
呵呵~ 我相信你一定是很聰明的,試試看和琳達的一樣嗎??
預覽如下

 

內文貼於此A1 內文貼於此A2 內文貼於此A3
內文貼於此A4 內文貼於此A5 內文貼於此A6

 


語法你猜對了嗎??來看看和三欄位表格多了什麼唄~

 

<TABLE BORDER=1>
<TR>
<TD>內文貼於此A1</TD><TD>內文貼於此A2</TD><TD>內文貼於此A3</TD></TR>
<TR>
<TD>內文貼於此A4</TD><TD>內文貼於此A5</TD><TD>內文貼於此A6</TD></TR>

</TABLE>

 


了解了格式化的語法,你是否對表格有些些的概念了呢?
.+:。(●ゝω・)~☆NEw!!゜.+:
若想在表格中加底色,只要在<TABLE BORDER=3的後面加上→BGCOLOR=色碼
請參考
๑۩۩๑琳達的色碼表 ;記住3要改成"3" ~~~ヾ(○゜▽゜○)
預覽樣式及語法

 

<TABLE BORDER="3" BGCOLOR=#FCB4FC>
<TR><TD>內文貼於此</TD></TR>
</TABLE>

 


又或者是

 

內文貼於此A1 內文貼於此A2
內文貼於此A3 內文貼於此A4

 

將BGCOLOR=色碼貼在<TR 後(要空一格喲~),
觀看語法如下

 

<TABLE BORDER="2" >
<TR><TD>內文貼於此A1</TD><TD>內文貼於此A2</TD></TR>
<TR BGCOLOR=#FCB4FC><TD>內文貼於此A3</TD><TD>內文貼於此A4</TD></TR>
</TABLE>

 


如果只是單一格要填上底色,就在<TD 後加上BGCOLOR=色碼

 

內文貼於此A1 內文貼於此A2 內文貼於此A3
內文貼於此A4 內文貼於此A5 內文貼於此A6

 


觀看語法如下

 

<TABLE BORDER=1>
<TR>
<TD>內文貼於此A1</TD><TD>內文貼於此A2</TD><TD>內文貼於此A3</TD></TR>
<TR>
<TD>內文貼於此A4</TD><TD BGCOLOR=#FCB4FC>內文貼於此A5</TD><TD>內文貼於此A6</TD></TR>
</TABLE>

 


今天初級班就先教到此,是否超簡單呀~ヾ(@゜▽゜@)ノ
學會後別忘了幫琳達推推喲~
領取琳達logo
琳達

<A href="http://tw.myblog.yahoo.com/linda590902/" target=blank><IMG alt="""""""""""琳達""""""""""" src="http://chuan0510.googlepages.com/chuan030.gif" border=0></A>




 


arrow
arrow
    全站熱搜
    創作者介紹
    創作者 馨晴 的頭像
    馨晴

    養生小站

    馨晴 發表在 痞客邦 留言(0) 人氣()