查看完整版本: HTML寫作入門講義

影子 2008-3-7 00:10

HTML寫作入門講義

網路發展學會HTML寫作入門講義[size=3][b]前     言:[/b][/size]Z ?S JR2A
P5MW aI?(j
  你可知道什麼是HTML嗎?HTML的全名是Hypertext Markup Language 其中文意思C9j5[m XH:w
是"超文件檔案標記語言",既然是一種語言,當然要先知道要用什麼工具來撰寫了,
&? |S&fW"h 然而HTML之撰寫卻有很多的工具可用,舉凡記事本 ; HTMLABC,HOTDOG輔助編譯軟體 ; m"N'l5[Pz%K^
WORD轉譯軟體 ; FRONTPAGE直書軟體等。諸多撰寫軟體可視使用者本身之喜好選擇,
f+k _6c1g0O,O#];gz 不過建議初學者不論用何種撰寫軟體書寫程式,最好先學會HTML之基本語法,方便日後
y}s |)L#I,D/] 修改等諸多好處。
sc9A&k"_ pAs
1QV!];~j_(\m [size=3][b]一、架構解說:[/b][/size][6e2SQ)r]'Iy)P/@

E\ PVSD`c^ I     每一個最小的HTML文件必需包含一個抬頭。而文件若要被當作HTML3.0,建議加一
E w:dB$C9]]Ty 段前言宣告。如下列第一行:
Z b&oN+S
$`mP|^'zt9p <!DOCTYPE HTML PUBLIC"-//IETF//DTD HTML 3.0//EN">;H&p$O$A6r#]6k
<HTML>....................................................................
2K d5R)|:c|uy-kv                                                                                .:_4P#A N4k1n
<HEAD>.............................                                      .
IT M0Y&eOB#Yh                                              .  這是HTML文件的起頭符號,可讓讀      . ]#aTx)`v
<TITLE>我是文件標題</TITLE> .->文件的讀者了解此為程式的開頭。      .
vm!TV"F \                                         .                                      .
]&HUI/B:N2~)Ni^ </HEAD>............................                                      .基aX.Nw#k
                                                                               .本
\1zL5z5Ao N%U <BODY>.............................                                      .架
2Xl yTWP%{                                         .  這主體BODY元素的意思是指在文件      .構*[4m%[j ]7?
.........內容(請參考內容語法)         .->中的所有文字的開端,其包含所有文    .%E([F HG Xia`
                                        .  件的標題層文字,段落及表例等等。    .
)O V f4eHL </BODY>............................                                      .P%W/{ n'R]
                                                                               .
U \(e _M0}@|Cd$} </HTML>...................................................................
e2X4| ? wc F [ [size=3][b]二、內容語法:[/b][/size]
l;X._n f&Dna
o"Zn^a;l a、標題層文字字型:
QRU*F9OD1o5z    語法:<Hn>...</Hn>,n=1~6f:X;Mk.YM1[+N.I$z
   說明:從H1到H6有六個不同字型大小的設定,而這六個基本標題層的文字字型定義
~ [S(m3e0T#j/\&[          如下:
c8NL`*zT!x'n8?+O$^ [table=0][tr][td]H1[/td][td]粗體、最大字型,靠中、上下會有一行或二行空白行。[/td][/tr]        [tr][td]H2[/td][td]粗體,大字型,偏左,上下會有一行或二行空白行。[/td][/tr]        [tr][td]H3[/td][td]粗體,大字型,有點向左邊縮排,上下會有一行或二行空白行。[/td][/tr]        [tr][td]H4[/td][td]粗體,正常字型,向左邊縮排,上下會有一行空白行。[/td][/tr]        [tr][td]H5[/td][td]粗體,較小字型,向左邊縮排,上面會有一行空白行。[/td][/tr]        [tr][td]H6[/td][td]粗體,更小字型,向左邊縮排,上面會有一行空白行。[/td][/tr][/table]   [url=http://ind.ntou.edu.tw/documents/html/demoa.htm]範例[/url]:<H1>我是H1標題<H1>
mm(K.V1qle2?    可以用<BaseFont Size=3>來設定字型的「參考大小」,如Size=3相當於<H4>
~ t g M$s}4ty    字型,然後再用<Font Size=+3>...</Font>來調整大小?
'Z$K5p9t"C;m    [url=http://ind.ntou.edu.tw/documents/html/demoa1.htm]範例[/url]
gn8Eaj(r
fw)v0O FZ6p b、段落符號:
A@)a3~eqJ    語法:<P>(此可以不在文字敘述後再加個</P>)6A$PfU+l0p
   說明:這個P指的是到下一行段落,也就會在行與行之間有一行空行。
3{)Z-k&~nR)s%r-QC3e    [url=http://ind.ntou.edu.tw/documents/html/demob.htm]範例[/url]:<P>我正在換段
v6P;WBYH7al E:M,i#Q n4Q\!N"SO
c、強制換行:
y_3rybh    語法:<BR>(此可以不在文字敘述後再加個</BR>)r8}H E9WM
   說明:換行也就是中斷文件內容換至下一行,若無此符號,即使用換行鍵「Enter」
O @Bh5C0[$n          至下一行,在一般瀏覽器中仍不被視在換行,除非是用<PRE>(底下介紹)r5MmK!rt|_N%GR_
         預先格式。?
X8a@7t5zf"opV    [url=http://ind.ntou.edu.tw/documents/html/democ.htm]範例[/url]:我正在換行<BR>2d FH*WK8}

te Q"O a m a d、預先格式:D6Q$Lu\-bH)RJK
   語法:<PRE>...</PRE>
0`Asb2GI+H!K    說明:PRE的語法是代表著一組文字已經被格式化過,即在<PRE>...</PRE>之間的文Zy~ mdN;` e
         字會以原先格式中的形式來顯示出來。
|lD B8cp-t    [url=http://ind.ntou.edu.tw/documents/html/demod.htm]範例[/url]:<PRE>
k,JzpwsM#F             我跟下一行不同 h"o7M7AO6{
               我跟上一行不一樣 Q;PcEAM#B
         </PRE>"]H-[/_1W+}8n"arx

cC}.q%Ma!w J e、水平線標示符號:e r*O|g
   語法:<HR>
K \ T}9vr    說明:水平線標示是被用來隔開文件中不同段落之文字或圖。
Nf{ _!L^#^Om    [url=http://ind.ntou.edu.tw/documents/html/demoe.htm]範例[/url]:<HR>
2X%SXgvC"J*U o-N}4BDkIN}c
f、有順序編號的表例:/CR1B(c$k+{){ VjN)AI
   語法:<OL>#bav#B8a
         <LI>有順序文字一&cw w4o*O5NP'u
         <LI>有順序文字二
(eq3AXivtPf#i l          </OL>
ckI[{)@._ a    說明:有順序編號的表列是指有數字為表例順序,這表例以<OL>為開端,再以<LI>[5R'Py4r ZH.i
         為表列順序為數字符號,再以</OL>為結束表列的順序。
A)QO(ek&_|Wb    [url=http://ind.ntou.edu.tw/documents/html/demof.htm]範例[/url]:c~@:vm&`.l{ B?
   你也可以用<OL type=A 或 a 或 I 或 i 或 1 >來指定「順序」的編碼方式ln-r6G$Wm7L}
[table=0][tr][td]TYPE=A[/td][td]英文大寫。也就是A,B,C,...[/td][/tr]        [tr][td]TYPE=a[/td][td]英文小寫。也就是a,b,c,...[/td][/tr]        [tr][td]TYPE=I[/td][td]大寫羅馬字。也就是,I,II,III...[/td][/tr]        [tr][td]TYPE=i[/td][td]英文大寫。也就是i,ii,iii,...[/td][/tr]        [tr][td]TYPE=1[/td][td]英文大寫。也就是1,2,3,...[/td][/tr][/table]你也可以用 START 來指定起始編號。$]eG.hr D
另外您也可以直接在</LI>標記中用Type屬性來指定「順序」編碼方式,
7tM*RI4g,_cD&HA 並且用Value來指定它的起始值。%[A3@3c2R h`$l1Z
   [url=http://ind.ntou.edu.tw/documents/html/demof1.htm]範例[/url]:
SL9o:O!Md+i,?Y V+q[i Uu?
Q$i&z ?r
g、無順序編號的表列:
k3e P2~ b2T;~P    語法:<UL>t.Rx krO|
         <LI>無順序編路文字一
w[.W+@x)f#f6~,o          <LI>無順序編路文字二{G9n9T!` B
         </UL>Z5^Nig A[ k
   說明:無順序編號的表列是指用非數字為表列順序,這表列以<UL>為開端而非以*E8u x],r"f*vI\
         <OL>,再以<LI>為表列順序符號,再以</UL>為結束表列的順序。b!PNH+D
   [url=http://ind.ntou.edu.tw/documents/html/demog.htm]範例[/url]
| XN,T1BE    你可以用<UL Type=??>來指定項目符號的外觀。
oJ9BW;]    [url=http://ind.ntou.edu.tw/documents/html/demog1.htm]範例[/url]6gG|l4e[

$LR fW6ly"g J M\0Y,`:w5X Tk*F3v,k
h、印刷字體的標示符號: EX^7x.kc;sl
   語法:<B>...</B>或<strong>...</strong>[b]粗體[/b]
*Eo4V(ohze8F          <I>...</I>或<em>...</em><或cite>...</cite>[i]斜體[/i],`*KV D,h;H
         <U>...</U>[u]加底線[/u]1V5Wejn[ }
         <TT>...</TT>打字體(較寬的字體)P1Y}O}b0v
       <Big>...</Big>加大3iOR&tx:i*P7n&~n
       <Small>...</Small>變小m})~C,K
       <Sup>...</Sup>上標I#H JTrCF#c V
       <Sub>...</Sub>下標
W,iERL[-YZ?0r&Y        <blink>...</blink>閃爍m|5c8k;?kO
       <center>...</center>置中[R&}+a)Mv O
       <!--...-->註解
V/{+J~w_^8~}r L          <blockquote>...</blockquote>向右縮排5個空白字元1WT.\d;o&Jf8z.Mg9Z
         &ampnbsp;空白字元
SUDGR3@h5F    [url=http://ind.ntou.edu.tw/documents/html/demoh.htm]範例[/url]:#HqmF.V4a| h(J

H@`yvnB Tt i、向中對齊:+dF A:Pb-DgzEA
   語法:<CENTER>...</CENTER>
z6\T|&@)Fu3jy    說明:即文字圖形……等均向中對齊。v? up2ZKP
   [url=http://ind.ntou.edu.tw/documents/html/demoi.htm]範例[/url]:<CENTER>我在中間</CENTER> gCrt!~s3f a0r x(}
   |UEo~,R+MM
k、超連結
Lp;b2b-P3E    語法:<A HREF="URL檔案名">*</A>
-_ OS?}4k7v    說明:以<A為起始標籤,空一格後,加入HREF=所要連結的文件地址(如:"URL檔
#EXl ~H9g1ch"kEY          名"),然後以大於>符號作為結束。在大於符號後,可以填寫這來源連結文
IqiJW.K          件名稱或內容。最後以</A>做為這來源標示語法的結尾。
-w&T~9c boJY)GQ    範例:<A HREF="http://ind.ntou.edu.tw/">IND網路發展學會</A>^6x8s~ \bz
         <A HREF="mailto:www@ind.ntou.edu.tw">有意見請來信</A>
Cv+H L:u&H~s(I5F\$]          <A HREF="ftp://ftp.ntou.edu.tw">海大FTP站</A>
TK7Cj!qW    備註:所謂URL是Uniform Resource Locator的縮寫,在中文裡暫且將它翻譯為共同_)Sy zqk&ypX
         性資源定址器.。
)t/N YiW ps. link="#RRGGBB" 可改變超文字的顏色,預設值為藍色。b!PP'A2t'K1A7BY
     alink(active link)屬性用來指定「鏈結中」的顏色。
D+T'jLT      vlink(visited link)屬性用來指定「鏈結後」的顏色。
#c/I;v1Ln.Y3TT
7[kJLH+g ^ l、秀圖標示符號&]8j} e6Nig){~V1^
   語法:<IMG SRC="檔案名" ALIGN=top/middle/bottom/left/right>Y9F0s mIb Og
   說明:秀圖標示符號IMG是為超文件中顯示合乎瀏覽器的圖形(例如:GIF或JPG圖形
JqIv;h          檔),而秀圖標示符號的用法是:
I+S7Dy|r          <IMG SRC="檔案名" ALIGN=top/middle/bottom/left/right> E%_J\O
         SRC        圖形來源指定,其屬性同於URL!j F6j[|(d&L5A i
         ALIGN        指定圖文顯示的位置。
!~ x1f~\~9f&fyY8T                         top        圖示說明文字與圖形上方對齊。
2ESl8e,_(I                         middle        圖示說明文字與圖形中間對齊。
pV e Y rTv&S;H&{                         bottom        圖示說明文字與圖形下方對齊。
[ GTK} [9p&vr                         left        圖示靠左。
(A%h ?ccKF5[a                         right        圖非靠右。.t"j_$Bi"D;b g0]
   [url=http://ind.ntou.edu.tw/documents/html/demol.htm]範例[/url]:<IMG SRC="test.gif" ALIGN=middle> n;r&Wp9A4C VSz.qC
   ps.<IMG SRC="test.gif" ALIGN=middle> Alt="酒井法子";其 Alt 屬性提供不看圖者的提示。mQpFbsZ'q
       幾個<IMG >的屬性:;`@D%q;xO t5Nc
        Border=???       設定圖的邊框厚度。K.P` h{/c5q
        Vspace=???       圖的垂直方向預留空白寬度。
dL7G,PTY'}*Eo         Hspace=???       圖的水平方向預留空白寬度。#?l Yw|:t9]
        LowSRC="???.gif"先載入這張低解析度的圖片,完畢後,再載入由SRC="???.gif"的圖片。
t!@ h6_wtbd         如果在HTML文件中,用<A name="one Name></A>宣告一個參考點,那麼
_ ~1iF(o         <A HREF="#one Name">獅子</A>就可以讓『獅子」這一超文字直接跳到同一篇/If iQOQ
        HTML文件中叫做「one Name」之參考點。也可指定別的HTML文件。
0h#z5b tjMCcz         </A HREF="other.html#oneName">虎鼻獅</A>
/I{2@/B0_jgl         </A HREF="http://140.121.134.37/other.html#oneName><虎鼻獅> pX-N5sc
        
CGDY6H9K m、加入背景顏色及圖形R\:C0S(fy
   語法:<BODY BGCOLOR="#??????">(加入背景顏色)By'y u){D
         <BODY BACKGROUND="圖形檔">1O `#um6o QF
   其設定通式為:<BODY bgcolor="RRGGBB">
,FmV q c    或<BODY bgcolor=RRGGBB>1}/Uo6js5E
   RR是以一個Byte來表示紅色的深淺 ( 十六進制的00~FF)
k z2kf7L:?9u    GG是以一個Byte來表示紅色的深淺 ( 十六進制的00~FF)8c&S1{~H7\%r:o$p3V7jq%t
   BB是以一個Byte來表示紅色的深淺 ( 十六進制的00~FF)@7d2]'I:F6j"y
   [url=http://ind.ntou.edu.tw/documents/html/demom11.htm]範例[/url]
nQ7}?^ E1i3q o
1UNR(@0xB%y    說明:一般預設的背景顏色,看來是那麼的單調,若想改背景顏色可以在BODY(文,Xy6Aws#m5Wf
         件主體)之後加入參數,如〝BGCOLOR=〞及〝BACKGROUND=〞來增填背景的N*u1jy m1V*h
         色彩及圖樣。
/B"d8@4? C)D    [url=http://ind.ntou.edu.tw/documents/html/demom.htm]範例[/url]:<BODY BGCOLOR="#FFFFFF">或<BODY BACKGROUND="test1.gif">
t`/F+L8F/s    備註:在加入顏色控制碼中,其中#為加入顏色數值的開始,而前兩碼數值代表紅色t$\kDo s
         ,中間兩碼代表綠色,而後兩碼則代表藍色,均以16進位換算即0~F。若知道
)M't+b;g;D(oc          此顏色的英文名稱,可以直接在引號中加入,
%y(qnf%e2xsqA          例如:<BODY BGCOLOR="white">則背景設定為白色。
7_7U7G P1qM8DR
lmo9Am rr]1x J PS.<BODY text="RRGGBB">可改變 text 的屬性o5~ UY2|3?` B"C3P
   [url=http://ind.ntou.edu.tw/documents/html/demom.htm]範例[/url]
J,l+?nYs
C"es#L M/AQ:d*L+IK n、表格'a4E0P:HE
語法:<Talbe>...</Talbe>
&aoIC(^#tUKZZh       Table 的 Border屬性可以指定「格子」的粗細。而每一個格子的內容用        ]6a t;DB Cjzc
       <TD>...</TD>來界定。TD是Table Data的縮寫。0Ln Ji1DBB
       <TR>是用來將資料項移到下一列。b1qEO|6wMO [ s]8L
       Align屬性用來調節它的水平對齊方向。
]{ut;D])h        VAlign屬性用來調節它的垂直對齊方向。
:?o"m2~6?~ [url=http://ind.ntou.edu.tw/documents/html/demon.htm]範例[/url]:h|9N9x/?x.~'g"QHU
       如果想要讓一個資料項佔用數個水平方格,可用ColSpan(跨行)。&wd4gRl%MHV$Nn
       如果想要讓一個資料項佔用數個垂直方格,可用RowSpan(跨列)。
S/X{I |&Q4R"]2|9CU E        我們可以用 Caption標記在 Table 上加上標題,它會自動對齊 Table 中間。
,b%UT g!j8yE         <TH>標記可以讓我們把 Table 中的某些項目當成「標頭」。          6D p(@2j mu"r&V:F
[url=http://ind.ntou.edu.tw/documents/html/demon1.htm]範例[/url]:P`6@z!xV.{\;L
       cellspaceing 屬性用來指定 Talbe 資料項間的間距,它也會影響 <Caption>
f7R o_y         標題與 Table 之間的距離。7f3GfX$y$]_b
       cellpadding 屬性用來指定資料項內部的「資料」與「資料項邊緣」的距離。
L8|/?D;{        width、height用來設定 Table 的大小,也可以用width=90%表示寬度會佔整個
{ t#{N}s9Y5E        視窗的百分之九十。也可以用來設定 TD 某一資料項的大小。
hS9oH q m)M         <TD bgcolor="?????">可用來指定每格的顏色。
M}#VEw)w;ET\ [url=http://ind.ntou.edu.tw/documents/html/demon2.htm]範例[/url]:nFC0?!~sO
t d'_^ ?3ti
o、Frame(分割視窗)}y%mp:x G\
[url=http://ind.ntou.edu.tw/documents/html/demoo.htm]範例[/url]:
{"D]^'Y9[M FrameSet Cols 除了用「百分比」之外,也可用點數表示。如:
{2Cdvzgb+g`4K <FrameSet Clos="50,*">表示第一個視窗為50點。!E,~pW-}]
<FrameSet Clos="*,50">表示第二個視窗為50點。
SujQ:a/|T/| <FrameSet Clos="50,50">表示二個視窗各佔一半。
oo7Pl@ d+zDg@F [url=http://ind.ntou.edu.tw/documents/html/demoo1.htm]範例[/url]:
tIY3Z%C)`h)k Frame 的六個屬性:2C#@D8b%O3K-sU
SRC 指定HTML文件,也可以是URL格式。如:<Frame SRC="http://www.hinet.net/>
kn0Z\&Q,I ZI MarginWidth設定分割視窗的顯示區與左邊邊界的距離。
R*[6yPT*\ \*W#MxI+g 如:<Frame SRC="A.htm MarginWidth=0>8GD!hav
MarginHeight設定分割視窗的顯示區與頂端邊界的距離。
A,H)H@.x.U 如:<Frame SRC="A.htm MarginHeight=10>
BH|Ki] Scrolling設定分割視窗要不要有捲軸。可設定為yes,no,或auto。
\$u0dK+R 如:<Frame SRC="A.htm Scrolling="auto">5Ru5XCY_
NoResize 讓分割視窗不能調整大小。
,A K[-v;O+yFgx 如:<Frame SRC="A.htm NoResize=0>#Nh$~KSP$V-K]-BhS*a
Name 替「分割視窗」取一名字,並用 Target 指定顯示視窗。
L_qMy8Y'a [url=http://ind.ntou.edu.tw/documents/html/demoo2.htm]範例[/url]:v9_U3|nu
B!K dO5Md:_oq/Sp
p、動態Web Page:AvVB5zp V
[url=http://ind.ntou.edu.tw/documents/html/comic.htm]範例[/url]:
`$} S}Q y%{c
:h U.YW:G 1M\;J"teEXa
r、FORM(表單) IYO~6O9R9BMi
語法:<FORM>...</FORM>N%X]C&r*\t)x#wA
      FORM具有二個屬性:tOR|+Tle1s
ACTION:設定表單連結到那一個URL,若沒指明,表示連到自己。
?~)MH"x METHOD:表示表單內容是利用何種管道傳送給CGI程式。有POST和GET二種,內定值為GET。~J.s3q$H^$EF
例如:<FORM METHOD="POST" ACTION="/cgi-bin/CGI_script">
e{D m'A-`+K%`&? ........... J|3^ jz7UJ$~%Y
</FORM>
w5\{ xQd.B
2a6_`3`b#Y~OH6p       TEXTAREA:它標示一個多行文字編輯區域,允許使用輸入資料。其屬性有:
'nTd0TJ [table=0][tr][td]NAME[/td][td]這個文字區域的名字。[/td][/tr]        [tr][td]ROWS[/td][td]這個文字區域顯示的行數。[/td][/tr]        [tr][td]COLS[/td][td]這個文字區域顯示的寬度,單位為字元數。[/td][/tr]        [tr][td=2,1]                [url=http://ind.ntou.edu.tw/documents/html/Demor1.htm]範例[/url]:<TEXTAREA                 NAME="comment" ROWS=4 COLS=50> THIS IS THE SAMPLE TEXT </TEXTAREA>                [/td][/tr][/table]SELECT:產生一個下拉式或捲軸式選單,其屬性有:`3~"d.@V%k
[table=0][tr][td]NAME[/td][td]這個選單輸入的名字。[/td][/tr]        [tr][td]SIZE[/td][td]選單呈現在螢幕上的大小,預設值為1,如果設成2以上,則變成捲軸式選單。[/td][/tr]        [tr][td]MULTIPLE[/td][td]多重選擇,如果用此屬性,不管SIZE為何,一律以捲軸式選單呈現。[/td][/tr][/table]<SELECT>與</SELECT>中間可以有許多選項,每一項皆以<OPTION>標示代表,O0d1o't0x8eg
OPTION屬性有:!Qu {'q;Gf
[table=0][tr][td]VALUE[/td][td]如果選擇這選項,則這選項的傳回值和使用者在瀏覽器所見相同[/td][/tr]        [tr][td]SELECTED[/td][td]這使此選項定為預設值。[/td][/tr][/table]INPUT: R^&H@5T2l2L!H
這標示包含多種輸入方法,包括文字(TEXT),密碼(PASSWORD),勾選式清單(CHECKBOX)、B Ock'Y Du
單選式清單(RADIO)、清除(RESET)按鈕、送出(SUBMIT)按鈕,以及上傳檔案(FILE)。
ft`B j["jb&B 這些輸入方法以TYPE屬性來區別。A G$A-Oj'ZS)H
文字(TEXT)有關的屬性                        NAME                輸入欄位的名字。                                SIZE                輸入欄位的大小。                                MAXLENGTH                最多容許輸入幾個字元。                                VALUE                預設值                                例如:輸入姓名:<INPUT TYPE="text" NAME="name" SIZE=20>        
N Yt$_rln 密碼(PASSWORD)有關的屬性                        NAME                輸入欄位的名字。                                SIZE                輸入欄位的大小。                                MAXLENGTH                最多容許輸入幾個字元。                                VALUE                預設值                                例如:輸入密碼:<INPUT TYPE="password" NAME="passwd"                 MAXLENGTH=20>         bI_!v2g\s
勾選式清單(CHECKBOX)有關的屬性                        NAME                欄位名字。                                VALUE                當此項目被勾選時,所傳回的值。                                CHECKED                將這欄位預設為被勾選。                                例如::<INPUT TYPE="checkbox" NAME="check1"                 VALUE="html">是否學過HTML?        PtO]'k:e}
m n%a:iO5|x"{A1W:r [d@

JUDg?1t4S 單選式清單(RADIO)有關的屬性                        NAME                欄位名字。                                VALUE                當此項目被勾選時,所傳回的值。                                CHECKED                將這欄位預設為被勾選。                                例如::<INPUT TYPE="radio" NAME="sex" VALUE="male">男        [url=http://ind.ntou.edu.tw/documents/html/demor.htm]範例[/url]:*H\:Q V@A@&[_Xz
^7B;n-tlh
[size=3][b]三、 如何在IND上秀出自己的HOMEPAGE[/b][/size]
2_ G-p"p"E5a3y9FiH9y
Y^ s!EW a、利用telnet連上自己的帳號,並在自己的帳號下建立一個www子目錄。BK`}%i{]0IpgP
   例如:ind~>mkdir www(輸入mkdir www再按enter即可建立一個www子目錄)
W c*ib H)RI q b、利用ftp程式把做好的HTML檔(如:*.html或*.htm檔)及圖形檔(如:
,pDAQajxo    *.gif或*.jpg檔)送到www這個目錄裡。注意:主頁一定要welcome.htm或
.|yz0CU    index.htm,而welcome.html及index.html也可以。
,SU5|q:Ke c、再利用WWW瀏覽器(如:NETSCAPE或INTERNET EXPLORER)輸入自己的網址,YY2s@D"l
   就可以看見自己的作品了。例如:[url=http://ind.ntou.edu.tw/~sun]http://ind.ntou.edu.tw/~sun[/url]。
V2BXH5u)Uc
!xK0qRL{Jy+Z4[ I 本講義原作者:蔡永熙
頁: [1]
查看完整版本: HTML寫作入門講義