📄 ch20.htm
字号:
24
Houston, Texas 77024. <BR><BR>
25 713
827 1827<BR><BR>
26 </CENTER><BR>
27 <hr><BR>
28 </BODY><BR>
29 </HTML></FONT></TT>
</BLOCKQUOTE>
<HR>
<P>
Line 6 defines a centered line of text with the <TT><FONT FACE="Courier"><Center></FONT></TT>
and <TT><FONT FACE="Courier"></Center></FONT></TT> tags.
Note how the <TT><FONT FACE="Courier"><H1></FONT></TT> and
<TT><FONT FACE="Courier"></H1></FONT></TT> tags are enclosed
along with the text being centered. Line 7 draws a horizontal
line. (Remember that HR stands for Horizontal Rule.) The <TT><FONT FACE="Courier"><b></FONT></TT>
and <TT><FONT FACE="Courier"></b></FONT></TT> tags are used
in lines 10 and 11 to embolden some text. Since HTML is case insensitive,
we could have used the tags <TT><FONT FACE="Courier"><B></FONT></TT>
and <TT><FONT FACE="Courier"></B></FONT></TT> with no loss
of functionality. Use of the <TT><FONT FACE="Courier"><EM></FONT></TT>
and <TT><FONT FACE="Courier"><STRONG></FONT></TT> tags is
shown in lines 14 and 15, respectively.
<P>
Note that the effect of <TT><FONT FACE="Courier"><B></FONT></TT>
remains in effect until the <TT><FONT FACE="Courier"></B></FONT></TT>
is seen. So the text being set to a style can be typed in across
several lines. In lines 19 through 26, center several lines.
<P>
In HTML documents you should use <TT><FONT FACE="Courier"><STRONG></FONT></TT>
and <TT><FONT FACE="Courier"><EM></FONT></TT> tags instead
of <TT><FONT FACE="Courier"><B></FONT></TT> and <TT><FONT FACE="Courier"><I></FONT></TT>
tags, respectively. There are occasions where using even seemingly
innocent tags such as <TT><FONT FACE="Courier"><B></FONT></TT>
for bolding text or <TT><FONT FACE="Courier"><I></FONT></TT>
for italicizing text may not work. For example, if a browser is
using a font that does not have an italics character set, the
<TT><FONT FACE="Courier"><I><I>text</I></I> </FONT></TT>will
be printed with its codes; that is, it will be as <TT><FONT FACE="Courier"><I><I>text</I></I></FONT></TT>
and not as <TT><I><FONT FACE="Courier">text</FONT></I></TT>. To
take care of some of these issues, should they arise, HTML authors
prefer to use the <TT><FONT FACE="Courier"><EM></EM></FONT></TT>
emphasis tags in place of the <TT><FONT FACE="Courier"><I></I></FONT></TT>
tags and the <TT><FONT FACE="Courier"><STRONG></STRONG></FONT></TT>
tags in place of the <TT><FONT FACE="Courier"><B></B></FONT></TT>.
<P>
An HTML document defines only the display style with the use of
markup tags. How a Web browser chooses to display the information
is left to the implementation at the Web browser. So the client's
browser is responsible for rendering this text and may have a
completely different font than what you are using to create the
page. Therefore, what you see on your screen will be different
from what someone else using a different font may see. For best
results, try viewing your HTML page with different browsers. The
font on someone else's browser might be completely different.
For one thing, users can choose whatever font they desire for
their browser. Even if users don't explicitly choose a font, the
browser may default to a font that is different from the one you
use. For example, one user may use the Internet Explorer from
Microsoft with a 10-point font, and another user may use Netscape
Navigator with a 12-point font. Each user will see different
lengths of paragraphs and text layout.
<P>
Simple text formatting with the use of carriage returns in HTML
documents does not work. The client browser will implement word
wrapping when it sees text. You can force paragraph and line breaks
with the use of <TT><FONT FACE="Courier"><P></FONT></TT>
or <TT><FONT FACE="Courier"><BR></FONT></TT> tags. The <TT><FONT FACE="Courier"><BR></FONT></TT>
tag creates a line break, and does not start a new paragraph
like the <TT><FONT FACE="Courier"><P></FONT></TT> tag. A
<TT><FONT FACE="Courier"><P></FONT></TT> tag may be used
to lay out text differently using formats and text alignment on
different types of browsers. A <TT><FONT FACE="Courier"><BR></FONT></TT>
tag simply starts a new line without changing the current paragraph
format. Not using these tags causes all white space (including
spaces, tabs, and blank lines) to be collapsed into one white
space. Listings 20.4 and 20.5 provide samples of two HTML files
that produce the same output.
<HR>
<BLOCKQUOTE>
<B>Listing 20.4. Headings in HTML files.<BR>
</B>
</BLOCKQUOTE>
<BLOCKQUOTE>
<TT><FONT FACE="Courier"> 1 <HTML><HEAD> <BR>
2 <TITLE>A simple HTML file</TITLE><BR>
3 </HEAD><BR>
4 <BODY><BR>
5 <H1>This is Header Level 1</H1><BR>
6 <H2>This is Header Level 2</H2><BR>
7 <H3>This is Header Level 3</H3><BR>
8 <H4>This is Header Level 4</H4><BR>
9 <H5>This is Header Level 5</H5><BR>
10 <H6>This is Header Level 6</H6><BR>
11 This is line 1<BR>
12 This is line 2<P><BR>
13 This is line 3<P><BR>
14 This is a broken line with an &ltBR&gt<BR> sign.
<BR>
15 <P><BR>
16 End of File Here.<BR>
17 </BODY><BR>
18 </HTML></FONT></TT>
</BLOCKQUOTE>
<HR>
<HR>
<BLOCKQUOTE>
<B>Listing 20.5. The second version of the HTML file shown in
Listing 20.4.<BR>
</B>
</BLOCKQUOTE>
<BLOCKQUOTE>
<TT><FONT FACE="Courier"> 1 <HTML><HEAD><TITLE>A
simple HTML file</TITLE><BR>
2 <HEAD><BR>
3 <BODY><BR>
4 <H1>This is Header Level 1</H1> <H2>This
is Header Level 2</H2><BR>
5 <H3>This is Header Level 3</H3> <H4>This
is Header Level 4</H4><BR>
6 <H5>This is Header Level 5</H5> <H6>This
is Header Level 6</H6><BR>
7 This is line 1 This is line 2<P> This is line 3<P>
<BR>
8 This is a broken line with an &ltoBR&gt<BR>
sign. <P> End of File Here.<BR>
9 </BODY></HTML></FONT></TT>
</BLOCKQUOTE>
<HR>
<P>
Figure 20.3 shows the output from both listings. Note how heading-level
1 and heading-level 2 are shown in the same font style in this
figure. The example shown here uses Netscape as the browser. The
results on your browser might be different because each browser
displays HTML in the way it chooses. It's a bit like the contents
of a box shifting during transport but the weight of the contents
has not changed.
<P>
<A HREF="f20-3.gif" tppabs="http://www.mcp.com/815097600/0-672/0-672-30891-6/f20-3.gif" ><B>Figure 20.3: </B><I>Using different heading levels.</I></A>
<P>
For the sake of readability, it's best to place headings and paragraphs
on separate blank lines along with <TT><FONT FACE="Courier"><P></FONT></TT>
tags. You can also specify formatting options for paragraph alignment
in the <TT><FONT FACE="Courier"><P></FONT></TT> tag, as
illustrated in Listing 20.5. The format specified for <TT><FONT FACE="Courier"><P></FONT></TT>
will continue until the next <TT><FONT FACE="Courier"><P></FONT></TT>
tag. To terminate a particular format you can use the <TT><FONT FACE="Courier"></P></FONT></TT>
tag.
<HR>
<BLOCKQUOTE>
<B>Listing 20.6. Aligning paragraphs.<BR>
</B>
</BLOCKQUOTE>
<BLOCKQUOTE>
<TT><FONT FACE="Courier"> 1 <html><BR>
2 <body><BR>
3 <TITLE>Aligned Paragraphs</TITLE><BR>
4 <H1>This shows aligned paragraphs</H1><BR>
5 <P ALIGN=CENTER>
<BR>
6 This line is centered<BR>
7 <P ALIGN=LEFT><BR>
8 This is aligned off the left margin<BR>
9 <P ALIGN=RIGHT><BR>
10 This is line aligned off the right margin<BR>
11 <P><BR>
12 End of File Here.<BR>
13 </body><BR>
14 </html></FONT></TT>
</BLOCKQUOTE>
<HR>
<P>
The output from this listing is shown in Figure 20.4.
<P>
<A HREF="f20-4.gif" tppabs="http://www.mcp.com/815097600/0-672/0-672-30891-6/f20-4.gif" ><B>Figure 20.4:</B> <I>Using aligned paragraphs.</I></A>
<H2><A NAME="PreformattedText"><FONT SIZE=5 COLOR=#FF0000>Preformatted
Text</FONT></A></H2>
<P>
Having the browser format text for you does keep you from a lot
of the hassle of tracking line breaks, paragraph formatting, and
so on. However, when displaying text that is already laid out
(such as source code), the default formatting can wreak havoc
on your source listings. For this reason, HTML documents have
the preformatted (<TT><FONT FACE="Courier"><PRE></FONT></TT>)
tag. Using the <TT><FONT FACE="Courier"><PRE></FONT></TT>
tag turns off the HTML formatting at the browser. Listing 20.8
contains an HTML file that illustrates using this tag. The output
is shown in Figure 20.5.
<P>
<A HREF="f20-5.gif" tppabs="http://www.mcp.com/815097600/0-672/0-672-30891-6/f20-5.gif" ><B>Figure 20.5:</B> <I>Preformatted text</I></A><I>.</I>
<HR>
<BLOCKQUOTE>
<B>Listing 20.7. Preformatted text.<BR>
</B>
</BLOCKQUOTE>
<BLOCKQUOTE>
<TT><FONT FACE="Courier"> 1 <html><BR>
2 <body><BR>
3 <TITLE>Yet Another Example</TITLE><BR>
4 <H1>This shows Raw vs. Preformatted Text</H1>
<BR>
5 <H3>Unformatted with the PRE tags </H3><BR>
6 <PRE><BR>
7 main(int argc, char *argv[])<BR>
8 {<BR>
9 int command;<BR>
10 <BR>
11 command = get_response();
<BR>
12 while (command != C_QUIT)
<BR>
13
{<BR>
14
process_command(command);<BR>
15
command = get_response();<BR>
16
}<BR>
17 <BR>
18 }<BR>
19 </PRE><BR>
20 <HR><BR>
21 <H3> Without the PRE tags </H3><BR>
22 <P><BR>
23 main(int argc, char *argv[])<BR>
24 {<BR>
25 int command;<BR>
26 <BR>
27 command = get_response();
<BR>
28 while (command != C_QUIT)
<BR>
29
{<BR>
30
process_command(command);<BR>
31
command = get_response();<BR>
32
}<BR>
33 <BR>
34 }<BR>
35 <BR>
36 </body><BR>
37 </html></FONT></TT>
</BLOCKQUOTE>
<HR>
<H2><FONT SIZE=5 COLOR=#FF0000><A NAME="SpecialCharactersinHTMLDocuments">Special Characters in HTML Documents</A></FONT>
</H2>
<P>
By now you have seen that the greater than symbol and the less
than symbol are used to encode documents. What if you wanted to
include them in text that was not in preformatted tags? There
are several special characters to encode these special symbols
in HTML. In order to include them in a file, you have to enter
their codes in the HTML file. Four of the most common special
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -