Sams Teach Yourself Web Publishing with HTML and CSS in One Hour a Day (5th Edition) P18 ppt

Special CharactersSpecial Characters As you learned earlier in the week, HTML files are ASCII text and should contain no formatting or fancy characters.. "If I can type a character like

Trang 1

Horizontal Rules

Figure 6.7 Examples of rule line thicknesses.

[View full size image]

The width attribute specifies the horizontal width of the rule line You can specify the exact width of the rule in pixels You can also specify the value as a percentage of the browser width (for example, 30% or 50%) If you set the width of a horizontal rule to a percentage, the width of the rule will change to conform to the window size if the user resizes the browser window Figure 6.8 shows the result of the following code, which displays some sample rule line widths:

Input

<hr />

Output

Figure 6.8 Examples of rule line widths.

file:///G|/1/0672328860/ch06lev1sec4.html (3 von 5) [19.12.2006 13:48:44]

Trang 2

Horizontal Rules

If you specify a width smaller than the actual width of the browser window, you can also specify the alignment of that rule with the align attribute, making it flush left (align="left"), flush right

(align="right"), or centered (align="center") By default, rule lines are centered

Finally, in most current browsers, the noshade attribute shown in the following example causes the browser to draw the rule line as a plain line without the three-dimensional shading, as shown in Figure 6.9

Handling Attributes Without Values

In HTML 4.0 and earlier versions, a value isn't required by the noshade attribute The

method you use to apply this attribute appears as follows:

To comply with XHTML 1.0, however, all attributes require a value The HTML 4.01

specification requires that Boolean attributes (such as noshade) have only the name of the

attribute itself as the value The following example demonstrates how to apply the noshade

attribute to the <hr> tag in compliance with the XHTML 1.0 specification

Trang 3

Horizontal Rules

<h1 align="center">NorthWestern Video</h1>

<h2 align="center">Presents</h2>

Output

Figure 6.9 Rule lines without shading.

Trang 4

Line Break

Line Break

The <br> tag breaks a line of text at the point where it appears When a web browser encounters a <br> tag, it restarts the text after the tag at the left margin (whatever the current left margin happens to be for the current element) You can use <br> within other elements, such as paragraphs or list items; <br> won't add extra space above or below the new line or change the font or style of the current entity All it does is restart the text at the next line

Closing Single Tags Properly

Like the <hr> tag, the <br> tag has no closing tag in HTML To convert this tag to XHTML

and to ensure compatibility with HTML browsers, add a space and forward slash to the end

of the tag and its attributes, as shown in the following example:

And then is heard no more: it is a tale <br />

Told by an idiot, full of sound and fury, <br />

Signifying nothing.</p>

The following example shows a simple paragraph in which each line (except for the last, which ends with

a closing <p> tag) ends with a <br>:

Input

<p>Tomorrow, and tomorrow, and tomorrow,<br />

Creeps in this petty pace from day to day,<br />

To the last syllable of recorded time;<br />

And all our yesterdays have lighted fools<br />

The way to dusty death Out, out, brief candle!<br />

Life's but a walking shadow; a poor player,<br />

That struts and frets his hour upon the stage,<br />

And then is heard no more: it is a tale <br />

Told by an idiot, full of sound and fury, <br />

Signifying nothing.</p>

Figure 6.10 shows how it appears in a browser

Note

clear is an attribute of the <br> tag It's used with images that have text wrapped

alongside them You'll learn about this attribute in Lesson 7, "Adding Images, Color, and

Trang 5

Line Break

Backgrounds."

Output

Figure 6.10 Line breaks.

Trang 6

Addresses

The address tag <address> is used for signature-like entities on web pages Address tags usually go at the bottom of each web page and are used to indicate who wrote the web page, who to contact for more information, the date, any copyright notices or other warnings, and anything else that seems

appropriate Addresses often are preceded with a rule line (<hr>), and the <br> tag can be used to

separate the lines

Without an address or some other method of signing your web pages, it's close to impossible to find out who wrote it or who to contact for more information Signing each of your web pages by using the

<address> tag is an excellent way to make sure that people can get in touch with you <address> is a block-level tag that italicizes the text inside it

The following input shows an address:

Input

<hr />

Laura Lemay <a href="mailto:lemay@lne.com">lemay@lne.com</a><br />

A service of Laura Lemay, Incorporated <br />

last revised January 10, 2003 <br />

Void where prohibited Keep hands and feet inside the vehicle at all times

</address>

Figure 6.11 shows it in a browser

Output

Figure 6.11 An address block.

file:///G|/1/0672328860/ch06lev1sec6.html [19.12.2006 13:48:45]

Trang 7

Quotations

The <blockquote> tag is used to create an indented block of text within a page (Unlike the <cite> tag, which highlights small quotes, <blockquote> is used for longer quotations that shouldn't be nested inside

other paragraphs.) For example, the Macbeth soliloquy I used in the example for line breaks would have

worked better as a <blockquote> than as a simple paragraph Here's an input example:

"During the whole of a dull, dark, and soundless day in the autumn

of the year, when the clouds hung oppressively low in the heavens,

I had been passing alone, on horseback, through a singularly dreary

tract of country, and at length found myself, as the shades of evening

grew on, within view of the melancholy House of Usher." -Edgar Allen Poe

</blockquote>

As with paragraphs, you can split lines in a <blockquote> using the line break tag, <br> The following input example shows an example of this use:

Input

Guns aren't lawful, <br />

nooses give.<br />

gas smells awful.<br />

You might as well live.<br />

-Dorothy Parker

</blockquote>

Figure 6.12 shows how the preceding input example appears in a browser

Output

Figure 6.12 A block quotation.

Trang 8

Note

The <blockquote> tag is often used not to set off quotations within text, but rather to create

margins on both sides of a page in order to make it more readable This technique works,

but strictly speaking, it's a misuse of the tag These days, you should control margins with

Cascading Style Sheets, as explained in Lesson 9, "Creating Layouts with CSS."

Trang 9

Special Characters

Special Characters

As you learned earlier in the week, HTML files are ASCII text and should contain no formatting or fancy characters In fact, the only characters you should put in your HTML files are the characters that are actually printed on your keyboard If you have to hold down any key other than Shift, or type an arcane combination of keys to produce a single character, you can't use that character in your HTML file This includes characters you might use every day, such as em dashes and curly quotes (if your word

processor is set up to do automatic curly quotes, you should turn them off when you write your HTML files)

"But wait a minute," you say "If I can type a character like a bullet or an accented a on my keyboard

using a special key sequence, and I can include it in an HTML file, and my browser can display it just fine when I look at that file, what's the problem?"

The problem is that the internal encoding your computer does to produce that character (which enables

it to show up properly in your HTML file and in your browser's display) probably won't translate to other computers Someone on the Internet who's reading your HTML file with that funny character in it might end up with some other character or just plain garbage Or, depending on how your page is sent over the Internet, the character might be lost before it ever gets to the computer where the file is being

viewed

So, what can you do? HTML provides a reasonable solution It defines a special set of codes, called

character entities, that you can include in your HTML files to represent the characters you want to use

When interpreted by a browser, these character entities are displayed as the appropriate special

characters for the given platform and font

Some special characters don't come from the set of extended ASCII characters For example, quotation marks and ampersands can be presented on a page using character entities even though they're found within the standard ASCII character set These characters have a special meaning in HTML documents within certain contexts, so they can be represented with character entities in order to avoid confusing the web browsers Modern browsers generally don't have a problem with these characters, but it's not a bad idea to use the entities anyway

Character Entities for Special Characters

Character entities take one of two forms: named entities and numbered entities

Named entities begin with an ampersand (&) and end with a semicolon (;) In between is the name of the character (or, more likely, a shorthand version of that name, such as agrave for an a with a grave

accent, or reg for a registered trademark sign) Unlike other HTML tags, the names are case sensitive,

so you should make sure to type them in exactly Named entities look something like the following:

à

"

«

©

The numbered entities also begin with an ampersand and end with a semicolon, but rather than a name, they have a pound sign (#) and a number The numbers correspond to character positions in the ISO-Latin-1 (ISO 8859-1) character Every character you can type or for which you can use a named entity

Trang 10

Special Characters

also has a numbered entity Numbered entities look like the following:

õ

You can use either numbers or named entities in your HTML file by including them in the same place

that the character they represent would go So, to place the word résumé in your HTML file, you would

use either

résumé

or

résumé

In Appendix B, "HTML 4.01 Quick Reference," I've included a table that lists the named entities currently supported by HTML See that table for specific characters

Character Set: ISO-Latin-1 Versus Unicode

HTML's use of the ISO-Latin-1 character set allows it to display most accented characters

on most platforms, but it has limitations For example, common characters such as bullets,

em dashes, and curly quotes simply aren't available in the ISO-Latin-1 character set

Therefore, you can't use these characters at all in your HTML files (If they're absolutely

necessary, you can create images representing those characters and use them on your

pages I don't recommend that option, though, because it can interfere with the layout of

your page Also, it can look odd if the user's browser is set to a nonstandard text size.)

Also, many ISO-Latin-1 characters might be entirely unavailable in some browsers,

depending on whether those characters exist on that platform and in the current font

HTML 4.01 takes things a huge leap further by proposing that Unicode should be available

as a character set for HTML documents Unicode is a standard character encoding system

that, although backward-compatible with our familiar ASCII encoding, offers the capability

to encode characters in almost any of the world's languages, including Chinese and

Japanese This means that documents can be created easily in any language, and they also

can contain multiple languages Both Internet Explorer and Netscape support Unicode, and

it can render documents in many of the scripts provided by Unicode as long as the

necessary fonts are available

This is an important step because Unicode is emerging as a new de facto standard for

character encoding Java uses Unicode as its default character encoding, for example, and

Windows supports Unicode character encoding

Character Entities for Reserved Characters

Định dạng
Số trang	10
Dung lượng	207,4 KB