A-1 HTML A-1-1 HTML 1 HTML JSP HTML HTML HTML JSP A HTML HTML HTML HTML HTML HTML HTML HTML.htm.html HTML Windows NotePad HTML IE [ / ] NotePad A-2

HTML A-1 HTML A-2 A-2 HTML A-8 A-3 A-14 A-4 A-26 A-5 A-30 A-6 A-42

HTML A A-1-2 HTML HTML HTML HTML HTML < > </ > HTML HTML < > </ > HTML <P> </P> HTML HTML <P> </P> HTML Align <P Align=Center> </P> HTML HTML HTML HTML A-3

HTML <HEAD> <BODY> <HEAD> <BODY> HTML <HEAD> </HEAD> <BODY> </BODY> HTML HTML HEAD BODY HTML HTML <HEAD> <BODY> A-4

HTML A <HEAD> <BODY> </HEAD> </BODY> HTML HTML Hyperlink HTML HTML HTML HTML Hypertext HTML HTML <IMG src="http://192.168.1.10/poweredby.gif> A-5

HTML HTML <BR> HTML HTML n n HTML <html> HTML HTML HTML Netscape IE HTML HTML 4.0 A-1-3 HTML HTML.htm.html HTML Windows NotePad Word WWW Windows FrontPage Dreamweaver HTML A-6

HTML A HTML JSP HTML JSP HTML HTML HTML HTML HTML A-1-4 HTML HTML HTML 0-3 HTML http://localhost:8080/jspbook/htmltutor/tutor.htm A-7

HTML HTML HTML A-2 HTML A-2-1 HTML 1-2-2 HTML < > HTML HTML < 1=" 1" 2=" 2" > A-8

HTML A </ > HTML < 1=" 1" 2=" 2" > </ > A-2-2 HTML HTML <HEAD><TITLE> </TITLE></HEAD> <BODY> </BODY> HTML HTML HTML <HEAD> <BODY> <HEAD> <HEAD> HTML A-9

<TITLE> <HEAD> HTML A-1 <TITLE> [ ] HTML <TITLE> [ ] appa\title.htm <HEAD> <TITLE>HTML </TITLE> </HEAD> <BODY> <P>TITLE </P> </BODY> <BODY> <BODY> HTML HTML HTML A-10

HTML A HTML A-3 A-5 A-2-3 <BODY></BODY> <BODY> HTML HTML <BODY> bgcolor bgcolor=" " Black Purple White Olive Gray Navy Silver Aqua Red Lime Green Maroon Blue Teal Yellow Fuchsia 16 #RRGGBB A-11

RR GG BB 00 FF <body bgcolor="#00ff00"> A-2 bgcolor HTML HTML <BODY bgcolor=blue> </BODY> [ ] HTML HTML text text= bgcolor A-12

HTML A link link= bgcolor vlink vlink= bgcolor alink alink= bgcolor background HTML GIF JPG background=" " Sub bg.gif HTML background="sub/bg.gif" A-6-1 A-13

A-3 A-3-1 <Hn></Hn> <Hn> <Hn> </Hn> 6 n 1 6 A-3 <Hn> HTML <BODY> <H1> 1</H1> <H2> 2</H2> <H3> 3</H3> <H4> 4</H4> <H5> 5</H5> <H6> 6</H6> </BODY> A-14

HTML A [ ] HTML HTML Align <Hn> align align= left center right A-4 align HTML <BODY> <h1 align=center> </h1> <h1 align=left> </h1> <h1 align=right> </h1> </BODY> A-15

[ ] HTML HTML A-3-2 <P></P> <P> <P> </P> <P> align align= left center right A-16

HTML A A-5 <P> align HTML <BODY> <P align=center> </P> <P align=left> </P> <P align=right> </P> </BODY> [ ] HTML HTML A-3-3 <BR> HTML <BR> A-17

HTML <BR> <P> A-6 <BR> HTML <BR> <BODY> <BR> <BR> </BODY> [ ] HTML HTML A-3-4 <HR> <HR> <HR> A-18

HTML A Size pixel 10 pixel <HR size=10> Width pixel 50% <HR width=50%> align align=center left right color 16 A-2-3 bgcolor color= noshade 3D A-19

A-7 HTML <BODY> <HR align=left> <HR align=left width= 50%> <HR size=10 width= 50%> <HR size=20 color="blue"> <HR size=20> <HR size=20 noshade> </BODY> [ ] HTML HTML A-3-5 <CENTER></CENTER> <CENTER> A-20

HTML A A-8 <CENTER> HTML <CENTER> <BODY> <CENTER> <P> </P> </CENTER> </BODY> [ ] HTML HTML A-3-6 <ol></ol> HTML <ol> <li> 1 <li> 2 <li> 3 </ol> <ol> A-21

type type=1 A a I i 1 A a I i start start=n n 2 C vi A-9 HTML c 3 <BODY> <ol type=a start="3"> <li> <li> <li> </ol> </BODY> A-22

HTML A [ ] HTML HTML C A-3-7 <ul></ul> <ul> <li> 1 <li> 2 <li> 3 </ul> type type=circle disc square type circle disc square A-23

A-10 HTML <BODY> <ul type=circle> <li> <li> <li> </ul> </BODY> [ ] HTML HTML A-3-8 <dl></dl> <dl> <dt> 1 <dd> 1 1 <dd> 1 2 <dt> 2 A-24

HTML A </dl> A-11 HTML <BODY> <dl> <dt> 1 <dd> 1 <dd> 2 <dt> 2 <dd> 1 <dd> 2 <dt> 3 </dl> </BODY> [ ] HTML HTML A-25

A-4 A-4-1 <Font></Font> <FONT 1= 1 2= 2 > </FONT> face face=" " size size= IE 7 7 color color=" " 16 A-2-3 bgcolor A-26

HTML A A-12 <FONT> HTML <FONT> <BODY> <BR><BR> <FONT face=" " size=1 color="blue"> 1 </Font><BR><BR> <FONT face=" " size=4 color="blue"> 4 </FONT><BR><BR> <FONT face=" " size=7 color="blue"> 7 </FONT> </BODY> [ ] HTML HTML A-4-2 <pre></pre> <pre> <pre> A-13 <pre> HTML <FONT> <BODY> <pre> A-27

</pre> </BODY> [ ] HTML HTML A-4-3 HTML <b></b> <i></i> <u></u> A-28

HTML A <s></s> <em></em> <strong></strong> <address> </address> <code> </code> <big> </big> <small> </small> <sup> </sup> A-29

<sub> </sub> A-5 A-5-1 HTML <TABLE> <TH> <TR> <TD> <TABLE></TABLE> - <TABLE> <TR> <TD> <TH> <TR></TR> - <TR> <TD> <TH> <TD></TD> - <TD> <TH></TH> - <TH> <TABLE> <TR> <TD> <TABLE> <TR><TD></TD></TR> </TABLE> A-30

HTML A A-14 HTML <BODY> <TABLE> <TR><TH> </TH><TH> </TH></TR> <TR><TD> </TD><TD> </TD></TR> <TR><TD> </TD><TD> </TD></TR> </TABLE> </BODY> [ ] HTML HTML A-5-2 <TABLE> <TABLE> border border border = pixel A-31

cellspacing cellspacing = pixel cellpadding cellpadding = pixel A-15 HTML <TABLE> <BODY> <TABLE border=10 cellspacing=10 cellpadding=10> <TR><TD> </TD><TD> </TD></TR> <TR><TD> </TD><TD> </TD></TR> </TABLE> </BODY> [ ] HTML HTML A-32

HTML A bordercolor bordercolor = 16 A-2-3 bgcolor bgcolor bgcolor = 16 A-2-3 bgcolor A-16 HTML yellow 3 blue A-33

<BODY> <TABLE bgcolor=yellow border=3 bordercolor=blue> <TR><TD> </TD><TD> </TD></TR> <TR><TD> </TD><TD> </TD></TR> </TABLE> </BODY> [ ] HTML HTML width width = pixel n% n width 50% height height = pixel n% n height 50% A-34

HTML A A-17 HTML 50% <BODY> <TABLE width=50% border=3> <TR><TD> </TD><TD> </TD></TR> <TR><TD> </TD><TD> </TD></TR> </TABLE> </BODY> [ ] HTML HTML align align = left center right A-18 HTML <BODY> <TABLE align=left border=3> <TR><TD> </TD></TR> A-35

</TABLE><BR> <TABLE align=center border=3> <TR><TD> </TD></TR> </TABLE><BR> <TABLE align=right border=3> <TR><TD> </TD></TR> </TABLE> </BODY> [ ] HTML HTML A-5-3 <TR> <TR> <TABLE> <TR> width height bgcolor bordercolor A-36

HTML A align <TR> align = left center right valign <TR> valign = top middle bottom baseline A-19 HTML <BODY> <TABLE width=50% border=3> <TR align=right> <TD> </TD> <TD> </TD> </TR> <TR align=center valign=bottom height=50> <TD> </TD> <TD> </TD> </TR> </TABLE> </BODY> A-37

[ ] HTML HTML A-5-4 <TD><TH> <TABLE> <TR> <TD> <TH> <TABLE> width height bgcolor bordercolor <TR> align valign <TD> <TH> colspan colspan = n n 3 2 3 A-20 colspan HTML colspan 2 <BODY> A-38

HTML A <TABLE border=3 > <TR> <TH colspan=3> </TH> </TR> <TR> <TH> </TH> <TH> </TH> <TH> </TH> </TR> </TABLE> </BODY> [ ] HTML HTML rowspan rowspan = n n 3 2 3 A-21 rowspan HTML rowspan 2 3 <BODY> A-39

<TABLE border=3 > <TR> <TH rowspan=3 width=30> </TH> <TH> </TH> </TR> <TR> <TH> </TH> </TR> <TR> <TH> </TH> </TR> </TABLE> </BODY> [ ] HTML HTML A-22 colspan rowspan HTML rowspan colspan <BODY> <TABLE border=3 > <TR> <TH rowspan=2 valign=bottom> </TH> </TR> <TR> <TH colspan=2> </TH> A-40

HTML A <TH> </TH> <TH> </TH> </TR> <TR> <TD> </TD> <TD> </TD> <TD> </TD> </TR> <TR> <TD> </TD> <TD> </TD> <TD> </TD> </TR> <TR> <TD> </TD> <TD> </TD> <TD> </TD> </TR> </TABLE></BODY> [ ] HTML HTML A-41

A-6 A-6-1 HTML Web Web. -.. - / - A-42

HTML A Web Ref.htm BeRef.gif./SubDir2/BeRef.gif. Dir1./SubDir2 SubDir2./ SubDir2/BeRef.gif /Dir1/SubDir2/BeRef.gif Web BeRef.gif Ref.htm BeRef.gif../Dir2/BeRef.gif..../Dir2 Dir2 /Dir2/BeRef.gif A-43

Web Ref1.htm BeRef1.gif../SubDir2/BeRef1.gif /Dir1/SubDir2/BeRef1.gif Ref2.htm BeRef1.gif../../Dir1/SubDir2/BeRef1.gif /Dir1/SubDir2/BeRef1.gif Ref1.htm BeRef2.htm../../Dir2/BeRef2.htm /Dir2/BeRef2.htm Ref2.htm BeRef2.htm../BeRef2.htm /Dir2/BeRef2.htm../../..../../ A-44

HTML A A-6-2 <A> </A> HTML <A></A> <A Href=" "> </A> <A></A> href URL URL :// / / http <a href="http://localhost:8080/jspbook/ch2/img.htm"> FTP FTP <a href="ftp://ftp-cnpa.admin.yzu.edu.tw"> A-45

Telnet <a href="telnet://bbs.iti.com.tw"> URL mailto: href <a href="mailto:sckuo1@ms32.hinet.net"> <a href="img.htm"> A-23 [ ] A-46

HTML A [ ] appa\hlink.htm <HEAD> <TITLE> </TITLE> </HEAD> <BODY> <CENTER> <FONT SIZE = 5 COLOR = blue> </FONT> </CENTER> <HR><BR><BR> <A Href = "http://localhost:8080/class/default.htm"> http </A> <BR><BR> <A Href = "/class/default.htm"> </A> <BR><BR> <A Href = "../../class/default.htm"> </A> <BR><BR> <A Href = "mailto:sc.kuo@msa.hinet.net"> </A> </BODY> A-6-3 <IMG> HTML GIF JPG <IMG> <img src=" "> src <IMG> A-6-1 A-47

mark.gif <img src="../mark.gif"> src URL 192.168.1.10 mark.gif <img src="http://192.168.1.10/mark.gif"> <IMG> alt alt alt=" " border border=n n 0 height height=n n pixel A-48

HTML A width width=n n pixel hspace hspace=n n pixel vspace A-24 border vspace [ ] A-49

[ ] appa\img.htm <HEAD> <TITLE> </TITLE> </HEAD> <BODY> <CENTER> <FONT SIZE = 5 COLOR = blue> </FONT> </CENTER> <HR> <BR> <IMG border = 5 src="a9073.gif" vspace=50><br> </BODY> A-6-4 HTML <Frameset> A-50

HTML A <Frame> <Frameset> <Frame> <Frameset> <Frame> <Frame> </Frameset> <Frameset> <BODY> <Frameset> <BODY> <Frameset> <Framest> <Frame> <Frameset> rows cols <Frameset> <Frameset> rows A-51

<Frameset rows=" 1, 2,, *"> <Frame> </Frameset> rows 1 2 * rows, <Frameset> <Frame> pixel <Frameset rows="200, 150, *"> <Frameset rows="50%, 30%, *"> A-25 70 70 <Frameset rows="70, 70, *"> <Frame> <Frame> <Frame> </Frameset> [ ] HTML HTML A-52

HTML A A-26 40% 30% 30% 100-40 - = 30 <Frameset rows="40%, 30%,*"> <Frame> <Frame> <Frame> </Frameset> [ ] HTML HTML A-53

<Frameset> cols <Frameset cols=" 1, 2,.,*"> <Frame> </Frameset> A-27 100 150 A-54

HTML A <Frameset cols="100, 150, *"> <Frame> <Frame> <Frame> </Frameset> [ ] HTML HTML A-28 40% 30% 30% 100-40 - = 30 <Frameset cols="40%, 30%,*"> <Frame> <Frame> <Frame> </Frameset> A-55

[ ] HTML HTML <Frame> name HTML src name HTML name name=" " A-56

HTML A src HTML src="html " A-6-3 <IMG> src first.htm <frame src="first.htm" name="main"> A-29 <Frameset cols="40%, 30%,*"> <Frame name="left" src="first.htm"> <Frame name="center" src="second.htm"> <Frame name="right" src="third.htm"> </Frameset> [ ] HTML HTML left center right A-57

frameborder frameborder <Frameset> <Frame> <Frameset> <Frame> frameborder=0 1 0 1 1 A-30 <Frameset cols="40%, 30%,*" frameborder=0> <Frame name="left" src="../appa/first.htm"> <Frame name="center" src="../appa/second.htm"> <Frame name="right" src="../appa/third.htm"> </Frameset> [ ] HTML HTML left center right A-58

A-59 HTML A <Frameset> A-31 <Frameset rows="30%,*"> <Frame> <Frameset cols="50%,*"> <Frame> <Frame> </Frameset> </Frameset> [ ] HTML HTML

target target target = " " target A-60 target=_blank - target=_self - target=_parent - target=_top -

HTML A A-32 target appa target.htm main HTML menu menu.htm 3 main [ ] [ ] target.htm exa-32\target.htm 001 002 <HEAD> 003 <TITLE> target </TITLE> 004 </HEAD> 005 <Frameset cols="30%, *"> 006 <Frame src="menu.htm" name="menu"> A-61

007 <Frame src="first.htm" name="main"> 008 </Frameset> 009 Menu menu.htm exa-32\menu.htm 001 002 <HEAD> 003 <TITLE>Menu </TITLE> 004 </HEAD> 005 <BODY> 006 <P><A href="first.htm" target=main> </A></P> 007 <P><A href="second.htm" target=main> </A></P> 008 <P><A href="third.htm" target=main> </A></P> 009 </BODY> 010 A-6-5  HTML HTML   A-62