Ôª ËØ. Òò ´Ë, Ò» ·Ý µä ÐÍ µÄ HTML ÎÄ µµ ¾ß ÓÐ ÒÔ Ï ½á ¹¹:
Ôª ËØ °ü º¬ ÁË µ± Ç°
ÎÄ µµ µÄ ЊϢ, Èç Ëü µÄ ±ê Ìâ, ±» ËÑ Ë÷ Òý Çæ ʹ Óà µÄ ¹Ø ¼ü ´Ê »ò Æä
Ëü ²» ÔÚ ÎÄ µµ ÄÚ ÈÝ ÖÐ ¿¼ ÂÇ µÄ Êý ¾Ý. ÔÚ
Éù Ã÷ ÖÐ µÄ Ôª ËØ ±Ø Ðë ²» ±» Ò» Ö ÐÔ Óà »§ ´ú Àí Æ÷ äÖ È¾ ³ý ·Ç Áí Íâ
Ö¸ ¶¨.
±êÌâ:TITLE ÔªËغÍ
title ÌØÐÔ
<!ELEMENT TITLE - - (#PCDATA)* -(%head.misc)
-- The TITLE element is not considered part of the flow of text.
It should be displayed, for example as the page header or
window title. Exactly one title is required per document.
-->
<!ATTLIST TITLE %i18n>
¿ª ʼ ±ê ¼Ç: Ðè Òª, ½á Êø ±ê ¼Ç: Ðè Òª
ÿ Ò» ¸ö HTML ÎÄ µµ
±Ø Ðë HEAD
²¿ ·Ö °ü À¨ Ò» ¸ö Õý È· µÄ
TITLE
Ôª ËØ. Óà »§ ´ú Àí Æ÷ ͨ ³£ ͨ ¹ý ±ê Ìâ À´ ¸ø ÈË ÃÇ Ò» Щ ¸Å Äî, Èç °Ñ
±ê Ìâ ×÷ Ϊ ˵Ã÷ ´Ê, »ò °Ñ Ëü ¶Á ³ö À´.
±ê Ìâ ¿É ÒÔ °ü º¬ ×Ö·ûÌõÄ¿ (¶Ô ÓÚ Óï
Æø Ç¿ µ÷, ÌØ Êâ ×Ö ·û µÈ µÈ), µ« ²» ¿É ÒÔ °ü À¨ Æä Ëü µÄ ±ê ×¢. Õâ ÊÇ Ò»
¸ö ÎÄ µµ ±ê Ìâ µÄ Àý ³Ì:
<HTML>
<HEAD>
<TITLE>A study of population dynamics</TITLE>
... other head elements...
</HEAD>
<BODY>
... document body...
</BODY>
</HTML>
Ïà Ó¦ ÓÚ
TITLE Ôª ËØ µÄ ÊÇ
title ÌØ ÐÔ.
ÌØ ÐÔ ¶¨ Òå
-
title = cdata
-
Õâ ¸ö ÌØ ÐÔ Èç ¹Ë ÎÊ °ã µÄ Ìá ¹© ÁË Ôª ËØ µÄ Éè Öà ЊϢ.
²» ͬ ÓÚ
TITLE Ôª ËØ Ìá ¹©
ÁË Õû ¸ö ÎÄ µµ µÄ ЊϢ ²¢ ÇÒ Ö» ³ö ÏÖ Ò» ´Î,
title
ÌØ ÐÔ ¿É ÒÔ ×¢ ½â ÈÎ Òâ Êý Á¿ µÄ Ôª ËØ. Çë ¼ì ²é Ôª ËØ µÄ ¶¨ Òå ÊÇ ·ñ Ìá
¹© Õâ ¸ö ÌØ ÐÔ.
title ÌØ
ÐÔ µÄ Öµ ¿É ÄÜ ±» Óà »§ ´ú Àí Æ÷ ÒÔ ¶à ÖÖ ·½ ʽ äÖ È¾. Àý Èç, ¿É ÊÓ »¯
ä¯ ÀÀ Æ÷ Íù Íù Óà "¹¤ ¾ß Ìá ʾ (tool tip)" (Ò» ¸ö ¶Ì µÄ ЊϢ ³ö ÏÖ ÓÚ
Êó ±ê Ö¸ ¶¨ ²¢ Í£ Áô ÔÚ Îï ¼þ ÉÏ Ê±) À´ ÏÔ Ê¾ ±ê Ìâ. Éù Ѷ Óà »§ ´ú Àí
Æ÷ Ò² Ïà Ó¦ µÄ ÀÉ ¶Á ±ê Ìâ ЊϢ. Àý Èç, ÔÚ Á´ ½Ó ÖÐ Éè Öà Õâ ¸ö ÌØ ÐÔ
À´ ÔÊ Ðí Óà »§ ´ú Àí Æ÷ ¸æ (¿É ÊÓ »¯ ºÍ ·Ç ¿É ÊÓ »¯ µÄ) Ëß Õâ ¸ö Á´ ½Ó
µÄ ×Ô È» ×Ê Ô´:
...some text...
Here's a photo of
<A href="http://someplace.com/neatstuff.gif" title="Me scuba diving">
me scuba diving last summer
</A>
...some more text...
µ± ʹ ÓÃ
LINK Ôª ËØ À´ Ö¸ ¶¨
Ò» ·Ý
Íⲿ·ç¸ñÒ³ ʱ
title
aÌØ ÐÔ ÓÐ Ò» ¸ö ¶î Íâ µÄ ×÷ ÓÃ. ¹Ø ÓÚ Ï¸ ½Ú Çë ²Î ÔÄ Ïà Ó¦ µÄ µ¥ ½Ú.
×¢ Òâ: Ϊ ÁË Ìá ¸ß Óï Òô ϵ ͳ ÔÚ ±ê ×¼ ¼¼ Êõ Ï ´¦
Àí Õâ ÖÖ Çé ¿ö µÄ ÖÊ Á¿, ½« À´ µÄ HTML °æ ±¾ ½« °ü À¨ ´¦ Àí Òô ËØ ºÍ Ê«
ÔÏ ÐŠϢ µÄ Ôª ËØ.
·ûºÏÐÅÏ¢
µ± Õâ ·Ý Ëµ Ã÷ Êé Íê ¸å ʱ, Ðí ¶à ¹Ø ÓÚ ÔÊ Ðí ×÷ Õß ·Ö Åä ¸ü ¸» ÓÐ µÄ
ÎÄ µµ Ò× ¶Á ЊϢ ºÍ Æä Ëü HTML ÎÄ µµ Íø Âç Ò× Óà ×Ê Ô´ µÄ ·½ ·¨ ÒÑ ¾
µÃ µ½ Ìá Òé.
µ± Ç° µÄ HTML ˵ Ã÷ Êé ÔÊ Ðí ×÷ Õß Èç Ï ָ ¶¨ Ëû ÃÇ ÎÄ µµ µÄ ·û ºÏ
ЊϢ:
-
×÷ Õß ¿É ÒÔ Òý Óà һ ¸ö Íâ ²¿ ÒÑ ¾ ¶¨ Òå µÄ ·û ºÏ Êý ¾Ý Êô ÐÔ µÄ ÂÖÀªÃèÊö.
Àý Èç, Ò» ·Ý ÂÖ Àª Ãè Êö ¿É ÄÜ ¶¨ Òå ÁË °ï Öú ËÑ Ë÷ Òý Çæ Ë÷ Òý ÎÄ µµ µÄ
Êô ÐÔ, Èç "×÷ Õß", "°æ Ȩ", "¹Ø ¼ü ´Ê" µÈ µÈ. Ò» ¸ö ÂÖ Àª Ãè Êö ͨ ¹ý profile
ÌØ ÐÔ ºÍ HEAD Ôª ËØ À´ Ö¸
¶¨.
-
×÷ Õß ¿É ÒÔ Éè Öà Õâ Щ Êô ÐÔ µÄ Öµ. ¿É ÒÔ ÊÇ:
-
ÎÄ µµ ´Ó ºÎ ¶ø À´, ͨ ¹ý META
Ôª ËØ. Òò ´Ë, ÂÖ Àª Ãè Êö ¿É ÒÔ ¶¨ Òå ¿É ±» META
Ôª ËØ Éè ¶¨ µÄ ÐÕ Ãû ¿Õ ¼ä Êô ÐÔ.
-
´Ó Íâ ²¿ ÎÄ µµ ¶ø À´, ͨ ¹ý LINK
Ôª ËØ(see the section on link types)
Á´ ½Ó µ½ ·û ºÏ Êý ¾Ý. Òò ´Ë, ÂÖ Àª ÎÄ ¼þ Ó¦ µ± ¶¨ Òå ¿É ±» LINK
Ôª ËØ Ê¹ Óà µÄ Áª ϵ Ãû ³Æ ¿Õ ¼ä..
×¢ Òâ Òò Ϊ Ò» ¸ö ÂÖ Àª ¶¨ Òå ÓÚ
HEAD
Ôª ËØ, ͬ Ò» ¸ö ÂÖ Àª Ò² Ó¦ Óà ÁË ÎÄ µµ Í· ÖÐ µÄ Ëù ÓÐ µÄ
META
ºÍ
LINK Ôª ËØ.
META ÔªËØ
<!ELEMENT META - O EMPTY -- Generic Metainformation -->
<!ATTLIST META
%i18n; -- lang, dir, for use with content string --
http-equiv NAME #IMPLIED -- HTTP response header name --
name NAME #IMPLIED -- metainformation name --
content CDATA #REQUIRED -- associated information --
scheme CDATA #IMPLIED -- select form of content --
>
¿ª ʼ ±ê ¼Ç: Ðè Òª, ½á Êø ±ê ¼Ç: ½û Ö¹
ÌØ ÐÔ ¶¨ Òå
¶Ô ÓÚ Ï ÁÐ µÄ ÌØ ÐÔ, Ëü ÃÇ µÄ ÔÊ Ðí µÄ Öµ ºÍ ½â Òë ·½ ʽ È¡ ¾ö ÓÚ ÂÖÀªÃèÊö:
-
name = cdata
-
Õâ ¸ö ÌØ ÐÔ Ö¸ ¶¨ Êô ÐÔ Ãû ³Æ.
-
content = cdata
-
Õâ ¸ö ÌØ ÐÔ Ö¸ ¶¨ Êô ÐÔ µÄ Öµ.
-
scheme = cdata
-
Õâ ¸ö ÌØ ÐÔ Ãü Ãû Ò» ¸ö Óà À´ ½â Òë Êô ÐÔ Öµ µÄ ·½ ·¨ µÄ Ãû ³Æ.
-
http-equiv = cdata
-
Õâ ¸ö ÌØ ÐÔ ¿É ±» Óà ÓÚ name ÌØ ÐÔ µÄ λ Öà ÉÏ. HTTP ·þ Îñ Æ÷
Óà Õâ ¸ö ÌØ ¶¨ À´ ×é Ö¯ HTTP Ïì Ó¦ Ïû Ï¢ µÄ Í· ЊϢ.
META Ôª ËØ ¿É ±» ÓÃ À´ Ãè
Êö ÎÄ µµ µÄ Êô ÐÔ (Èç ×÷ Õß, ÖÕ Ö¹ ÈÕ ÆÚ, ¹Ø ¼ü ´Ê ÁÐ ±í µÈ µÈ) ²¢ ÇÒ ·Ö
Åä Õâ Щ Êô ÐÔ µÄ Öµ. Õâ ·Ý Ëµ Ã÷ Êé û ÓÐ ¶¨ Òå Õâ Щ Êô ÐÔ µÄ ±ê ×¼ Éè
ÖÃ.
name ÌØ ÐÔ Ö¸ ¶¨ Êô ÐÔ ¶ø content
ÌØ ÐÔ Ôò Ö¸ ¶¨ Êô ÐÔ µÄ Öµ. Àý Èç,
<META name="Author" content="Dave Raggett">
lang ÌØ ÐÔ ¿É Óë
META
Ò» Æð ʹ Óà À´ Ö¸ ¶¨
content
ÌØ ÐÔ Öµ µÄ Óï ÑÔ. Õâ ÔÊ Ðí Óï Òô ϵ ͳ ¸ù ¾Ý ·¢ Òô ¹æ ¸ñ À´ Ó¦ Óà Óï ÑÔ.
Àý Èç, ×÷ Õß µÄ ÐÕ Ãû Óà ·¨ Óï Éù Ã÷.
<META name="Author" lang="fr" content="Arnaud Le Hors">
Õâ ÊÇ Ò» ¸ö ×÷ Õß Àý ³Ì: Ò» Щ Óà »§ ´ú Àí Æ÷ Ìá ¹©
ÔÚ ¼¸ Ãë ÖÓ ºó ͨ ¹ý
META
Ë¢ ÐÂ µ± Ç° Ò³ Ãæ, »ò ÓÃ Æä Ëü Ò³ À´ ´ú Ìæ.
<META name="refresh" content="3,http://www.acme.com/intro.html">
Õâ ¸ö ÄÚ ÈÝ ÖÐ µÄ Êý ×Ö Ö¸ ¶¨ ÁË ÑÓ Ê± Ãë Êý, ÔÚ URL ±» µ÷ Èë ºó ¼Æ ʱ
¿ª ʼ. Õâ ¸ö ½á ¹¹ ͨ ³£ ±» Óà À´ Ïò Óà »§ Õ¹ ʾ Ò» ¸ö ·É ¿ì µÄ ½é ÉÜ.
²» ¹ý, ÓÉ ÓÚ Ä³ Щ Óà »§ ´ú Àí Æ÷ ²» Ìá ¹© Õâ ¸ö ½á ¹¹, ×÷ Õß Ó¦ µ± ÔÚ
½é ÉÜ Ò³ ÖÐ °ü º¬ Õâ ¸ö ÄÚ ÈÝ À´ Òý µ¼ Óà »§ ÈÆ ¿ª Ëü (Ëù ÒÔ »¹ ²» ×÷ Ϊ
±£ Áô µÄ ½é ÉÜ Ò³ µÄ "×é ³É ²¿ ·Ö").
META ºÍ HTTP Í·
http-equiv ÌØ ÐÔ ¿É
ÒÔ ÓÃ ÔÚ
name ÌØ ÐÔ µÄ λ Öà ÉÏ ²¢ ÇÒ ÔÚ ÎÄ µµ ͨ ¹ý ³¬ ÎÄ ±¾
´« Êä Ð Òé (Hypertext Transfer Protocol, HTTP) »Ö ¸´ ʱ ÓÐ Æä ÌØ Êâ µÄ
ÖØ Òª ÐÔ. HTTP ·þ Îñ Æ÷ ¿É ÒÔ Ê¹ ÓÃ
http-equiv
ÌØ ÐÔ Ö¸ ¶¨ µÄ Êô ÐÔ Ãû ³Æ ÔÚ HTTP Ïì Ó¦ ÖÐ Éú ³É Ò» ¸ö
[RFC822]-·ç
¸ñ Í·. ¹Ø ÓÚ HTTP Í· µÄ ϸ ½Ú Çë ²Î ¼û HTTP ˵ Ã÷ Êé (
[RFC2068]).
Ï ÁÐ µÄ Àý ³Ì ÊÇ
META
Éù Ã÷:
<META http-equiv="Expires" content="Tue, 20 Aug 1996 14:25:27 GMT">
»á ʹ HTTP Í· ±í ÏÖ Îª:
Expires: Tue, 20 Aug 1996 14:25:27 GMT
Õâ ¿É ÒÔ Èà »º ³å À´ ¾ö ¶¨ ºÎ ʱ È¡ µÃ Ò» ·Ý ¹Ø Áª ÎÄ µµ µÄ Ë¢ Р°æ ±¾.
META ºÍËÑË÷ÒýÇæ
META µÄ ͨ ³£ Óà ´¦ ÊÇ Ö¸
¶¨ ËÑ Ë÷ Òý Çæ Óà À´ Ìá ¸ß ËÑ Ë÷ ÖÊ Á¿ µÄ ¹Ø ¼ü ´Ê. µ± Êý ¸ö
META
Ôª ËØ Ìá ¹© ÎÄ µµ Óï ÑÔ ´Ó Êô ЊϢ ʱ, ËÑ Ë÷ Òý Çæ »á ʹ ÓÃ
lang
ÌØ ÐÔ À´ ¹ý ÂË ²¢ ͨ Óà Óà »§ µÄ Óï ÑÔ ÓÅ ÏÈ ²Î ÕÕ À´ ÏÔ Ê¾ ËÑ Ë÷ ½á ¹û.
Àý Èç:
<META name="keywords" lang="en"
content="vacation,Greece,sunshine">
<META name="keywords" lang="fr"
content="vacances,Grèce,soleil">
ËÑ Ë÷ Òý Ë÷ µÄ Ч Á¦ Ò² ¿É ÒÔ Í¨ ¹ý ʹ ÓÃ
LINK
Ôª ËØ À´ Ö¸ ¶¨ ת »» ·½ ¹¤ À´ Ìá ¸ß, Æä ÖÐ Æä Ëü Óï ÑÔ ÎÄ µµ, Á´ ½Ó µ½
ÎÄ µµ °æ ±¾ µÄ Æä Ëü ý Ìå ¸ñ ʽ (Èç PDF) ÒÔ ¼° µ± ÎÄ µµ ÊÇ Ò» ¸ö ¼¯ ºÏ
µÄ ²¿ ·Ö, Á´ ½Ó µ½ ä¯ ÀÀ ¼¯ µÄ ÊÊ ÒË ¿ª ʼ ´¦ µÈ µÈ.
»¥ Áª Íø ÄÚ ÈÝ Ñ¡ Ôñ (Internet Content Selection)
[PICS]
µÄ ƽ ̨ ÊÇ Ò» ÖÖ ÊÇ Óë »¥ Áª Íø ÄÚ ÈÝ Áª ϵ ±ê Ç© µÄ (·û ºÏ Êý ¾Ý) µÄ
µÍ ²ã ½á ¹¹. Ô ÏÈ µÄ Éè ¶¨ ¿É ÒÔ °ï Öú ¸¸ ºÍ ʦ ¿Ø ÖÆ ×Ó ÊÇ ·ñ ¿É ÒÔ ÔÚ
»¥ Áª Íø ÉÏ ÔË ÐÐ, Ëü Ò² ÓÐ Àû ÓÚ Æä Ëü µÄ Óà »§ ±ê Ç©, °ü À¨ ´ú Âë ·û
ºÅ, Òþ ˽ ºÍ ÖÇ Á¦ ÐÔ µÄ Õý È· ·Ö Åä.
Õâ ¸ö Àý ³Ì ¾Ù Àý ˵ Ã÷ ÁË Èç ºÎ Ê¹ ÓÃ
META
Éù Ã÷ À´ °ü º¬ Ò» ¸ö PICS 1.1 ±ê Ç©:
<HEAD>
<META http-equiv="PICS-Label" content='
(PICS-1.1 "http://www.gcf.org/v2.5"
labels on "1994.11.05T08:15-0500"
until "1995.12.31T23:59-0000"
for "http://w3.org/PICS/Overview.html"
ratings (suds 0.5 density 0 color/hue 1))
'>
<TITLE>..title goes here..</TITLE>
</HEAD>
<BODY>
...the body...
</BODY>
META ÓëȱʡÐÅÏ¢
META Ôª ËØ ¿É ÒÔ ÔÚ ÏÂ Àý
ÖÐ Ö¸ ¶¨ ÎÄ µµ µÄ ȱ Ê¡ ЊϢ:
Ï Ãæ µÄ Àý ³Ì Ö¸ ¶¨ ÁË ×÷ Ϊ ISO-8859-5 ÎÄ µµ µÄ
×Ö·û½âÂ뷽ʽ
<META http-equiv="Content-Type" content="text/html; charset=ISO-8859-5">
·ûºÏÊý¾ÝµÄÂÖÀªÃèÊö
HEAD µÄ
profile
ÌØ ¶¨ Ö¸ ¶¨ ÁË ·û ºÏ Êý ¾Ý µÄ ÂÖ Àª Ãè Êö µÄ λ ÖÃ.
profile
ÌØ ÐÔ µÄ Öµ ÊÇ Í³ Ò» ×Ê Ô´ ¶¨ λ Æ÷. Óà »§ ´ú Àí Æ÷ ¿É ÒÔ ÒÔ Á½ ÖÖ Í¾ ¾¶
À´ ʹ Óà ͳ Ò» ×Ê Ô´ ¶¨ λ Æ÷:
-
×÷ Ϊ Ψ Ò» µÄ ͨ Óà µÄ È« ¾Ö µÄÃû ³Æ. Óà »§ ´ú Àí Æ÷ ¿É ÄÜ ÄÜ ¹» ʶ ±ð
Õâ ¸ö Ãû ³Æ (ÏÖ ÔÚ ²» È¡ »Ø ÂÖ Àª Ãè Êö) ²¢ ÇÒ Ö´ ÐÐ Ò» Щ »ù ÓÚ ÒÑ Öª
ÂÖ Àª Ãè Êö Ô¼ ¶¨ µÄ ½ø ³Ì. Àý Èç, ËÑ Ë÷ Òý Çæ ¿É ÒÔ Ìá ¹© Ò» ¸ö ÔÚ HTML
ÎÄ µµ Ä¿ ¼ ÖÐ ËÑ Ë÷ µÄ ½Ó ¿Ú, ¶ø Õâ Щ ÎÄ µµ ¶Ô ÓÚ Ä¿ ¼ Ïì Ó¦ ¾ù ʹ ÓÃ
Ïà ͬ µÄ ÂÖ Àª Ãè Êö.
-
×÷ Ϊ Ò» ¸ö Á´ ½Ó, Óà »§ ´ú Àí Æ÷ ¿É ÄÜ ·Ï Æú Õâ ¸ö ͳ Ò» ×Ê Ô´ ¶¨ λ,
¶ø Ö´ ÐÐ Ò» Щ ÔÚ ÂÖ Àª Ãè Êö ÖÐ ¶¨ Òå µÄ ¶« ¶« (Àý Èç: È· ¶¨ µ± Ç° HTML
ÖÐ µÄ ÂÖ Àª Ãè Êö ÓРЧ). Õâ ·Ý Ëµ Ã÷ Êé û ÓÐ ¶¨ ·½ ÂÖ Àª Ãè Êö µÄ ¸ñ
ʽ.
Õâ ¸ö Àý ³Ì Òý Óà һ ·Ý ¼Ù ¶¨ µÄ ÂÖ Àª Ãè Êö À´ ¶¨
Òå ÓÐ Óà µÄ ÎÄ µµ Ë÷ Òý Êô ÐÔ. ÓÉ ´Ë ÂÖ Àª Ãè Êö ¶¨ Òå µÄ Êô ÐÔ --- °ü
À¨ "×÷ Õß", "°æ Ȩ", "¹Ø ¼ü ´Ê" ºÍ "ÈÕ ÆÚ" --- ÔÚ ºó À´ µÄ
META
Éù Ã÷ ÖÐ Éè Öµ.
<HEAD profile="http://www.acme.com/profiles/core">
<TITLE>How to complete Memorandum cover sheets</TITLE>
<META name="author" content="John Doe">
<META name="copyright" content="© 1997 Acme Corp.">
<META name="keywords" content="corporate,guidelines,cataloging">
<META name="date" content="23 Jan 1997 16:05:31 GMT">
</HEAD>
ÔÚ Õâ ·Ý Ëµ Ã÷ Êé Íê ¸å ʱ, ͨ ³£ ³¢ ÊÔ Ê¹ Óà ÔÚ [RFC2068]
Ãè Êö µÄ ·½ ʽ. HTTP µÄ Ó¦ Óà ¶Ô ÓÚ ÈÕ ÆÚ / ʱ ¼ä Ó¡ ¼Ç ÔÚ Àú Ê· ÉÏ ÓÐ
¹ý Èý ÖÖ ²» ͬ µÄ ¸ñ ʽ:
Sun, 06 Nov 1994 08:49:37 GMT ; RFC 822, ÓÉ RFC 1123 ¸ü ÐÂ
Sunday, 06-Nov-94 08:49:37 GMT ; RFC 850, ±» RFC 1036 ÌÔ Ì
Sun Nov 6 08:49:37 1994 ; ANSI C µÄ asctime() ¸ñ ʽ
¸ù ¾Ý [RFC2068],
µÚ Ò» ÖÖ ¸ñ ʽ ÊÇ Ê× Ñ¡ µÄ. Ëü ´ú ±í ÁË Ò» ÖÖ ÔÚ [RFC1123]
([RFC822] µÄ
Éý ¼¶) ÖÐ ¶¨ Òå µÄ ×é ºÏ ³¤ ¶È µÄ ×Ó ¼¯. µÚ ¶þ ÖÖ ¸ñ ʽ ÊÇ Í¨ ³£ ±» ʹ
Óà µÄ, µ« Ëü »ù ÓÚ ±» ÌÔ Ì µÄ [RFC850]
µÄ ÈÕ ÆÚ ¸ñ ʽ ²¢ ÇÒ È± ·¦ 4-Êý ×Ö Äê ·Ý. HTTP 1.1 ¿Í »§ ±Ø Ðë ½Ó ÊÜ Ëù
ÓÐ µÄ Õâ Щ ¸ñ ʽ, µ« ÔÚ HTML Í· ÖÐ Ö» ʹ Óà [RFC1123]
¸ñ ʽ. Ï£ Íû HTML Óà »§ ´ú Àí Æ÷ ÔÚ ´Ë ÎÊ Ìâ ÉÏ ×ñ Ñ HTTP 1.1, ²¢ ÇÒ ¶î
Íâ µØ Ö¸ ¹© [ISO8601]
ÈÕ ÆÚ ¸ñ ʽ, Àý Èç "1997-01-23T16:05:31+00:00". ¹Ø ÓÚ ¸ü ¶à µÄ ЊϢ, Çë
²Î ÔÄ INS ºÍ DEL
Ôª ËØ ²¿ ·Ö.
µ± ÓÐ Êô ÐÔ Ìá ¹© ¶à ÖÖ ¸ñ ʽ ʱ, scheme
ÌØ ÐÔ Öµ Óà À´ ±ê ʶ content
ÌØ ÐÔ ÆÚ Íû µÄ Öµ. ÔÊ Ðí µÄ scheme
ÌØ ÐÔ µÄ Öµ È¡ ¾ö ÓÚ name Êô ÐÔ µÄ ÂÖÀªÃèÊö.
Ï Ãæ Àý ³Ì ÖÐ µÄ µÚ Ò» ¸ö
META
Éù Ã÷ Òý Óà Dewey Decimal System (dds) ·½ °¸. µÚ ¶þ ¸ö Òý Óà ISBN ·½°¸.
<META scheme="dds" name="description"
content="04.251 Supercomputers systems design">
<META scheme="ISBN" name="identifier" content="0-8230-2355-9">
×¢ Òâ: ÓÐ Ò» ¸ö Àý ³Ì ÂÖ Àª Ãè Êö ÊÇ Dublin Core[DCORE].
Õâ ¸ö ÂÖ Àª Ãè Êö ¶¨ Òå µç ×Ó Öø ×÷ Ìâ ½â Ãè Êö ¼¯, ²¢ ÇÒ ÓÐ Òâ Óà À´ Ìá
¸ß ²» ͬ µÄ Ãè Êö Ä£ °æ µÄ ͳ Ò» ÐÔ.
BODY ÔªËØ
<!ENTITY % block "(%blocklevel | %inline)*">
<!ENTITY % Color "CDATA" -- a color using sRGB: #RRGGBB as Hex values -->
<!-- There are also 16 widely known color names with their sRGB values:
Black = #000000 Green = #008000
Silver = #C0C0C0 Lime = #00FF00
Gray = #808080 Olive = #808000
White = #FFFFFF Yellow = #FFFF00
Maroon = #800000 Navy = #000080
Red = #FF0000 Blue = #0000FF
Purple = #800080 Teal = #008080
Fuchsia= #FF00FF Aqua = #00FFFF
-->
<!ENTITY % bodycolors "
bgcolor %Color #IMPLIED
text %Color #IMPLIED
link %Color #IMPLIED
vlink %Color #IMPLIED
alink %Color #IMPLIED
">
<!ELEMENT BODY O O (%block) -(BODY) +(INS|DEL)>
<!ATTLIST BODY
%attrs; -- %coreattrs, %i18n, %events --
background %URL #IMPLIED -- texture tile for document background --
%bodycolors; -- bgcolor, text, link, vlink, alink --
onload %Script #IMPLIED -- the document has been loaded --
onunload %Script #IMPLIED -- the document has been removed --
>
¿ª ʼ ±ê ¼Ç: ¿É Ñ¡, ½á Êø ±ê ¼Ç: ¿É Ñ¡
ÌØ ÐÔ ¶¨ Òå
-
background = url
-
²» ÔÞ ³É. Õâ ¸ö ÌØ ÐÔ µÄ Öµ ÊÇ Ö¸ Ã÷ ͼ Ïñ ×Ê Ô´ µÄ ͳ Ò» ×Ê Ô´
λ ÖÃ. Õâ ¸ö ͼ Ïñ ͨ ³£ Óà À´ ÆÌ ³É ±³ ¾° (¶Ô ÓÚ ¿É ÊÓ ä¯ ÀÀ Æ÷).
-
text =color
-
²» ÔÞ ³É. Õâ ¸ö ÌØ ÐÔ Öµ Éè ¶¨ ÎÄ ±¾ µÄ Ç° ¾° É« (¶Ô ÓÚ ¿É ÊÓ ä¯
ÀÀ Æ÷).
-
link = color
-
²» ÔÞ ³É. Õâ ¸ö ÌØ ÐÔ Öµ Óà À´ Éè ¶¨ ±ê ×¢ δ ·Ã ÎÊ Á´ ½Ó ÎÄ ±¾
µÄ ÑÕ É« (¶Ô ÓÚ ¿É ÊÓ ä¯ ÀÀ Æ÷).
-
vlink = color
-
²» ÔÞ ³É. Õâ ¸ö ÌØ ÐÔ Öµ Óà À´ Éè ¶¨ ±ê ×¢ ÒÑ ·Ã ÎÊ Á´ ½Ó ÎÄ ±¾
µÄ ÑÕ É« (¶Ô ÓÚ ¿É ÊÓ ä¯ ÀÀ Æ÷).
-
alink = color
-
²» ÔÞ ³É. Õâ ¸ö ÌØ ÐÔ Öµ Óà À´ Éè ¶¨ µ± Óà »§ Ñ¡ ¶¨ Á´ ½Ó ÎÄ ±¾
ʱ µÄ ÑÕ É« (¶Ô ÓÚ ¿É ÊÓ ä¯ ÀÀ Æ÷).
ÔÚ Ëü ´¦ ¶¨ Òå µÄ ÌØ ÐÔ
-
id, class
(¹ã·ºµÄÎĵµ±êʶ·û)
-
lang (ÓïÑÔÐÅÏ¢),
dir (ÎÄ×Ö·½Ïò)
-
title (ÔªËرêÌâ)
-
style (ÐÐÄÚ·ç¸ñÐÅÏ¢)
-
bgcolor (±³¾°É«)
-
onload, onunload
(ÄÚ²¿Ê¼þ)
-
onclick, ondblclick,
onmousedown,
onmouseup,
onmouseover,
onmousemove,
onmouseout,
onkeypress,
onkeydown,
onkeyup (ÄÚ²¿Ê¼þ)
ÎÄ µµ µÄ Ö÷ ¸É °ü º¬ ÁËÎÄ µµ µÄ ÄÚ ÈÝ. Óà »§ ´ú Àí Æ÷ ͨ ¹ý ¶à ÖÖ Í¾ ¾¶
À´ ±í ÏÖ Õâ Щ ÄÚ ÈÝ. Àý Èç, ¶Ô ÓÚ ¿É ÊÓ ä¯ ÀÀ Æ÷, Äã ¿É ÒÔ °Ñ Ö÷ ¸É Ïë
Ïó ³É Ò» ÕÅ » ²¼, ¿É ÒÔ ³ö ÏÖ: ÎÄ ×Ö, ͼ Ïñ, ÑÕ É«, ͼ °¸ µÈ µÈ. ¶Ô ÓÚ
Éù Ïñ ´ú Àí Æ÷, Ïà ͬ µÄ ÄÚ ÈÝ ½« ±» ÀÊ ¶Á. ¼È È»
·ç¸ñÒ³
ÊÇ Ê× Ñ¡ µÄ ÎÄ µµ ±í ´ï ·½ ʽ, ³Â Êö ÌØ ÐÔ
BODY
¸Õ ³É Ϊ ²» ÔÞ ³É µÄ. Õâ Щ ÌØ ÐÔ Ö» ÓÐ µ± Äã ´ò Ëã ¿Ø ÖÆ ²» Ìá ¹© ·ç ¸ñ
Ò³ µÄ Óà »§ ´ú Àí Æ÷ ʱ ʹ ÓÃ.
Ï Ãæ µÄ Óï ¾ä ¾Ù Àý ˵ Ã÷ ÁË HTML µÄ ²»
ÔÞ ³É µÄ ÌØ ÐÔ. Ëü °Ñ » ²¼ µÄ ÑÕ É« Éè ³É °× É«, ÎÄ ×Ö Ç° ¾° É« Éè Ϊ
ºÚ É«, ³õ ʼ µÄ ³¬ Á´ ÑÕ É« Ϊ ºì, ÔÚ ¼¤ »î ʱ ÊÇ Ñó ºì, ¶ø ÔÚ ·Ã ÎÊ ¹ý
ºó Ôò ³Ê ÏÖ Àõ É«.
²» ÔÞ ³É Àý ³Ì:
<HTML>
<HEAD>
<TITLE>A study of population dynamics</TITLE>
/HEAD>
<BODY bgcolor="white" text="black"
link="red" alink="fuschia" vlink="maroon">
... document body...
</BODY>
</HTML>
ʹ ÓÃ
·ç¸ñÒ³, Ïà ͬ µÄ Ч ¹û ¿É ÒÔ Èç
Ï Íê ³É:
<HTML>
<HEAD>
<TITLE>A study of population dynamics</TITLE>
<STYLE type="text/css">
BODY { background: white; color: black}
A:link { color: red }
A:visited { color: maroon }
A:active { color: fuschia }
</STYLE>
</HEAD>
<BODY>
... document body...
</BODY>
</HTML>
ʹ Óà ·ç ¸ñ Ò³ ¸ø Äã µ÷ Õû ÎÄ µµ ±í ´ï µÄ µ¯ ÐÔ ¶ø ²» Óà ¸Ä ±ä ÎÄ µµ:
<HTML>
<HEAD>
<TITLE>A study of population dynamics</TITLE>
<LINK rel="stylesheet" type="text/css" href="smartstyle.css">
</HEAD>
<BODY>
... document body...
</BODY>
</HTML>
¿ò ºÍ HTML Ö÷ ¸É. °ü º¬ ¿ò µÄ ÎÄ µµ ͨ ¹ý FRAMESET
Ôª ËØ À´ ´ú Ìæ BODY Ôª ËØ.
Çë ²é ÔÄ ¿ò ²¿ ·Ö À´ »ñ µÃ ¸ü ¶à ЊϢ.
ÔªËرêʶ·û: id ºÍ class ÌØÐÔ
ÌØ ÐÔ ¶¨ Òå
-
id = name
-
Õâ ¸ö ÌØ ÐÔ ·Ö Åä ÁË ¹ã ·º µÄ ÎÄ µµ Ãû ×÷ Ϊ Ò» ¸ö Ôª ËØ µÄ ʵ Àý. ÔÚ ÎÄ
µµ ÄÚ id µÄ Öµ ±Ø Ðë ÊÇ Î¨ Ò»
µÄ. ´Ë Íâ, Õâ ¸ö ÌØ ÐÔ Óë name ÌØ ÐÔ Ïí Óà ͬ Ò» ¸ö Ãü Ãû ¿Õ ¼ä.
-
class = cdata-list
-
Õâ ¸ö ÌØ ÐÔ ·Ö Åä ÁË Ò» ¸ö Àà »ò Àà µÄ ¼¯ ºÏ ×÷ Ϊ Ò» ¸ö Ö¸ ¶¨ µÄ Ôª ËØ
ʵ Àý. ÈÎ Òâ Êý Á¿ µÄ Ôª ËØ ¿É ÒÔ ±» ·Ö Åä ³É Ïà ͬ µÄ Àà Ãû »ò Ãû ×Ö.
Ëü ÃÇ ±Ø Ðë ÒÔ ¿Õ °× À´ ·Ö ¿ª.
id ºÍ
class
ÌØ ÐÔ ·Ö Åä Ôª ËØ Êµ Àý Ò» ¸ö ±ê ʶ ·û.
Ò» ¸ö ÓÉ id Ö¸ ¶¨ µÄ ±ê ʶ
·û ÔÚ Ò» ·Ý ÎÄ µµ ÖÐ ±Ø Ðë ÊÇ Î¨ Ò» µÄ. Ò» ¸ö class
Ö¸ ¶¨ µÄ Àà Ãû ¿É ÒÔ ±» Êý ¸ö Ôª ËØ Êµ Àý ¹² Ïí. Àà µÄ Öµ Ó¦ µ± Ñ¡ Óà ÄÜ
¹» ±æ ÈÏ µÄ Óë Ôª ËØ ÓÐ ¹Ø µÄ ´Ê, Èç note, example ÒÔ ¼° warning µÈ.
Õâ Щ ÌØ ÐÔ ¿É ÒÔ Í¨ ¹ý Ï ÁР; ¾¶ ʹ ÓÃ:
-
id ÌØ ÐÔ ¿É ÒÔ ×÷ Ϊ ³¬ ÎÄ ±¾
Á´ ½Ó µÄ Ä¿ ±ê ʹ Óà (²Î ¼û êµã ²¿ ·Ö).
-
½Å ±¾ ¿É ÒÔ Ê¹ Óà id ÌØ ÐÔ À´
²Î ÕÕ Ò» ¸ö ÌØ ¶¨ µÄ Ôª ËØ.
-
·ç ¸ñ Ò³ ¿É ÒÔ Í¨ ¹ý id ÌØ ÐÔ
À´ ¶Ô ÌØ ¶¨ µÄ Ôª ËØ Ìá ¹© ·ç ¸ñ.
-
id ÌØ ÐÔ ±» Óà À´ ±ê ʶ OBJECT
Ôª ËØ Éù Ã÷.
-
·ç ¸ñ Ò³ ¿É ÒÔ Ê¹ Óà class
ÌØ ÐÔ À´ ¶Ô Ò» ×é Óë Àà Ïà ¹Ø µÄ »ò ×÷ Ϊ Àà µÄ ×Ó Ôª ËØ µÄ ¼¯ ºÏ Ìá ¹©
·ç ¸ñ.
-
id ºÍ class
Á½ Õß ¾ù ÄÜ Óà ÓÚ ½ø Ò» ²½ µÄ ´¦ Àí Ä¿ µÄ, Àý Èç Óà À´ Ö¸ ¶¨ °Ñ Êý ¾Ý ´Ó
HTML Ò³ Ìá È¡ µ½ Êý ¾Ý ¿â ʱ ±ê ʶ ×Ö ¶Î, °Ñ HTML ÎÄ µµ ת »» ³É ±ð µÄ
¸ñ ʽ ʱ, µÈ µÈ).
¼¸ ºõ ÿ Ò» ¸ö HTML Ôª ËØ ¿É ÒÔ ±» ·Ö Åä ±ê ʶ ·û ºÍ Àà ЊϢ.
Àý Èç, ÎÒ ÃÇ ¼Ù ¶¨ ±à д Ò» ·Ý ¹Ø ÓÚ ±à ³Ì Óï ÑÔ µÄ
ÎÄ µµ. Õâ ¸ö ÎÄ µµ ¿É ÒÔ °ü º¬ Ò» ¶¨ Êý Á¿ µÄ Ô¤ Öà ÎÄ ±¾. ÎÒ ÃÇ ¶Ô ÓÚ
Àý ³Ì ʹ ÓÃ
PRE Ôª ËØ À´ ±ê ¶¨
¸ñ ʽ. ¶ø ÇÒ Ò² ·Ö Åä Ëù ÓÐ µÄ Êô ÓÚ "example" Àà µÄ
PRE
Ôª ËØ ÖÐ µÄ Àý ³Ì µÄ ±³ ¾° É« Ϊ ÂÌ É« (green).
<HEAD>
<STYLE
PRE.example { background : green }
</STYLE
</HEAD>
<BODY>
<PRE class="example" id="example-1">
...example code here...
</PRE>
</BODY>
¶Ô ´Ë Àý ³Ì ͨ ¹ý Éè ¶¨
id ÌØ
ÐÔ, ÎÒ ÃÇ ÄÜ ¹» (1) Ϊ Æä ½¨ Á¢ Ò» ¸ö ³¬ Á´ ºÍ (2) ³¬ Ô½ ʵ Àý ·ç ¸ñ µÄ
Àà ·ç ¸ñ ЊϢ.
ÔªËرà×é:DIV ºÍSPAN
ÔªËØ
<!ELEMENT DIV - - %block>
<!ATTLIST DIV
%attrs; -- %coreattrs, %i18n, %events --
%align; -- align, text alignment --
>
<!ELEMENT SPAN - - (%inline)* -- generic language/style container -->
<!ATTLIST SPAN
%attrs; -- %coreattrs, %i18n, %events --
>
¿ª ʼ ±ê ¼Ç: Ðè Òª, ½á Êø ±ê ¼Ç: Ðè Òª
ÔÚ Ëü ´¦ ¶¨ Òå µÄ ÌØ ÐÔ
-
id, class
(ÎÄ·ºµÄÎĵµ±êʶ·û)
-
lang (ÓïÑÔÐÅÏ¢),
dir (ÎÄ×Ö·½Ïò)
-
title (ÔªËرêÌâ)
-
style (ÐÐÄÚ·ç¸ñÐÅÏ¢)
-
align (¶ÔÆ뷽ʽ)
-
onclick, ondblclick,
onmousedown,
onmouseup,
onmouseover,
onmousemove,
onmouseout,
onkeypress,
onkeydown,
onkeyup (ÄÚ²¿Ê¼þ)
DIV ºÍ
SPAN
Ôª ËØ, ×÷ Ϊ
id ºÍ
class
ÌØ ÐÔ µÄ Á¬ ½Ó ´Ê, Ìá ¹© ÁË Ò» ¸ö ͨ ³£ µØ ¶Ô ÎÄ µµ ¼Ó Èë ½á ¹¹ µÄ »ú ÖÆ.
Õâ ÊÇ ½ö ÓÐ µÄ Á½ ¸ö HTML Ôª ËØ ²» ÄÜ ÔÚ Ëü ÃÇ ÄÚ ÈÝ ÖÐ ¸½ ¼Ó ³Â Êö. Òò
´Ë , ͨ ¹ý ½¨ Á¢ ʵ Àý ºÍ Ôª ËØ µÄ Àà ÒÔ ¼° Ïò Ëü ÃÇ Ìá ¹©
·ç¸ñÒ³,
×÷ Õß ¿É ÒÔ ¸ù ¾Ý Ëû ÃÇ µÄ Ðè Òª ºÍ ¼Ù ¶¨ À´ Ö¸ ¶¨ HTML.
Éè Ïë ÎÒ ÃÇ ´ò Ëã Éú ³É Ò» ¸ö À´ ×Ô ÓÚ ¿Í »§ ЊϢ
Êý ¾Ý ¿â µÄ ÎÄ µµ. ÓÉ ÓÚ HTML ²» °ü À¨ ±ê ʶ Ϊ "client", "telephone number",
"email address" µÈ µÈ µÄ ¶Ô Ïó Ôª ËØ, ÎÒ ÃÇ Ê¹ ÓÃ
DIV
ºÍ
SPAN À´ ·ì ºÏ HTML Óë ÎÒ
ÃÇ µÄ Ðè Òª.
ÔÚ ´Ë Àý ÖÐ, ÿ ¸ö ¿Í »§ µÄ ÐÕ Êô ÓÚ "client-last-name" Àà µÈ µÈ. ÎÒ
ÃÇ Ò² ·Ö Åä ¸ø ÿ ¸ö Óà »§ Ò» ¸ö Ψ Ò» ±ê Ö¾ ·û ("client-boyera", "client-lafon"
µÈ µÈ).
<DIV id="client-boyera" class="client">
<SPAN class="client-last-name">Last name:</SPAN> Boyera,
<SPAN class="client-first-name">First name:</SPAN> Stephane
<SPAN class="client-tel">Telephone:</SPAN> (212) 555-1212
<SPAN class="client-email">Email:</SPAN> sb@foo.org
</DIV>
<DIV id="client-lafon" class="client">
<SPAN class="client-last-name">Last name:</SPAN> Lafon,
<SPAN class="client-first-name">First name:</SPAN> Yves
<SPAN class="client-tel">Telephone:</SPAN> (617) 555-1212
<SPAN class="client-email">Email:</SPAN> yves@bar.com
</DIV>
È» ºó, ÎÒ ÃÇ ¿É ÒÔ ¼ò µ¥ µØ °Ñ ·ç ¸ñ ЊϢ ¼Ó µ½ ÎÒ ÃÇ µÄ ÎÄ µµ À´ ʹ Õâ
Щ Êý ¾Ý ¿â Ìõ Ä¿ ºÍ г ÏÔ Ê¾.
µ± Äã Ïë Ϊ Ò» ×é µ¥ ´Ê ·Ö Åä Àà »ò Óï ÑÔ ÐŠϢ ʱ,
SPAN
ÊÇ Ò» ¸ö ¿É ÒÔ ÔÚ ¶Î Âä, ÁÐ ±í Ìõ Ä¿ µÈ Ïî Ä¿ ÖРʹ Óà µÄ ÐÐ ÄÚ Ôª ËØ.
SPAN ²» ÄÜ ÓÃ À´ ¶Ô ·â ±Õ
¼¶ Ôª ËØ ±à ×é.
SPAN ÔÚ äÖ
Ⱦ ÉÏ Ã» ÓÐ Ìì Éú µÄ Ч ¹û Ö± µ½ Äã Ìá ¹© Ò» ¸ö ·ç ¸ñ, Àý Èç ͨ ¹ý
style
ÌØ ÐÔ »ò Á´ ½Ó µ½ ·ç ¸ñ Ò³.
DIV Óë Ö® Ïà ·´ , ÊÇ ·â
±Õ ¼¶ Ôª ËØ. Ëü ¿É ÒÔ Óà À´ ¶Ô Æä Ëü µÄ ·â ±Õ ¼¶ Ôª ËØ ±à ×é, µ« ²» ÄÜ
Óà ÓÚ ¶Î Âä Ôª ËØ ÖÐ. DIV Ôª
ËØ ½ô ¸ú Ò» ¸ö ´ò ¿ª µÄ P Ôª ËØ
½« ÖÕ Ö¹ ÄÇ ¸ö ¶Î Âä.
Óà »§ ´ú Àí Æ÷ ͨ ³£ ÔÚ DIV
Ôª ËØ Ç° ºó ·Å ÖÃ Ò» ¸ö »» ÐÐ, Àý Èç:
<P>aaaaaaaaa<DIV>bbbbbbbbb</DIV><DIV>ccccc<P>ccccc</DIV>
Õâ µä ÐÍ µØ ±» äÖ È¾ ³É:
aaaaaaaaa
bbbbbbbbb
ccccc
ccccc
Äã µÄ Óà »§ ´ú Àí Æ÷ Ò² ¿É ÄÜ Èç Ï äÖ È¾:
aaaaaaaaabbbbbbbbbccccc
ccccc
Òýµ¼: TheH1,H2,H3,H4,H5,H6
ÔªËØ
<!ENTITY % heading "H1|H2|H3|H4|H5|H6">
<!--
There are six levels of headings from H1 (the most important)
to H6 (the least important).
-->
<!ELEMENT (%heading) - - (%inline;)*>
<!ATTLIST (%heading)
%attrs; -- %coreattrs, %i18n, %events --
%align; -- align, text alignment --
>
¿ª ʼ ±ê ¼Ç: Ðè Òª, ½á Êø ±ê ¼Ç: Ðè Òª
ÔÚ Ëü ´¦ ¶¨ Òå µÄ ÌØ ÐÔ
-
id, class
(¹ã·ºµÄÎĵµ±êʶ·û)
-
lang (ÓïÑÔÐÅÏ¢),
dir (ÎÄ×Ö·½Ïò)
-
title (ÔªËرêÌâ)
-
style (ÐÐÄÚ·ç¸ñÐÅÏ¢)
-
align (¶ÔÆ뷽ʽ)
-
onclick, ondblclick,
onmousedown,
onmouseup,
onmouseover,
onmousemove,
onmouseout,
onkeypress,
onkeydown,
onkeyup (ÄÚ²¿Ê¼þ)
Ò» ¸ö Òý µ¼ Ôª ËØ ¼ò Òª µÄ Ãè Êö ÁË Õâ ¸ö ²¿ ·Ö µÄ ½é ÉÜ Ö÷ Ìâ. Òý µ¼ ÐÅ
Ï¢ ¿É Óà ±» Óà »§ ´ú Àí Æ÷ ʹ ÓÃ, Àý Èç ×Ô ¶¯ µØ Ϊ ÎÄ µµ Éú ³É Ò» ¸ö Ä¿
¼ ±í ¸ñ.
HTML ÖÐ ÓÐ 6 ÖÖ ¼¶ ±ð µÄ Òý µ¼ ´Ó ×î ÖØ Òª H1
µ½ ×î ²» ÖØ Òª µÄ H6. Óà »§
´ú Àí Æ÷ ½« ʹ Óà ½Ï ´ó µÄ ×Ö Ìå À´ äÖ È¾ ±È ½Ï ÖØ Òª µÄ Òý µ¼ ЊϢ.
Ï Ãæ µÄ Àý ³Ì Õ¹ ʾ ÁË Èç ºÎ Ê¹ Óà ÔÚ ºó Ðø ÎÄ µµ
ʹ ÓÃ
DIV Ôª ËØ À´ Áª ϵ Ò»
¸ö Òý µ¼ ЊϢ. Õâ Ñù ×ö ÔÊÐí Äã ¶¨ ͨ ¹ý ·ç ¸ñ Ò³ À´ ¶¨ Òå Õâ ²¿ ·Ö µÄ
·ç ¸ñ (¶¨ Òå ±³ ¾° É«, Éè Öà ×Ö Ìå µÈ µÈ).
<DIV class="section" id="forest-elephants" >
<H1>Forest elephants</H1>
In this section, we discuss the lesser known forest elephants.
...this section continues...
<DIV class="subsection" id="forest-habitat" >
<H2>Habitat</H2>
Forest elephants do not live in trees but among them.
...this subsection continues...
</DIV>
</DIV>
Õâ ¸ö ½á ¹¹ ¿É ÒÔ Èç Ï ͨ ¹ý ·ç ¸ñ ЊϢ À´ ×° ÊÎ:
<HEAD>
<STYLE>
DIV.section { text-align: justify; font-size: 12pt}
DIV.subsection { text-indent: 2em }
H1 { font-style: italic; color: green }
H2 { color: green }
</STYLE>
</HEAD>
±ê ºÅ Õ ½Ú Óë ²Î ÕÕ
HTML ×Ô ÐÐ ²¢ ²» Éú ³É ÓÉ Òý µ¼ ЊϢ Éú ³É µÄ Õ ½Ú ±à ºÅ. È» ¶ø
Õâ ¸ö »ú ÖÆ ¿É ÓÉ Óà »§ ´ú Àí Æ÷ Ìá ¹©. ²» ¾Ã µÄ ½« À´, Èç CSS Ö® Àà ·ç
¸ñ Ò³ Óï ÑÔ ½« ÔÊ Ðí ×÷ Õß À´ ¿Ø ÖÆ Õ ½Ú ºÅ µÄ ²ú Éú (ͨ ¹ý ÎÄ µµ ÖРת
µÝ ²Î ÕÕ ²Ù ×÷, Èç "²Î ÔÄ Õ ½Ú 7.2").
ij Щ ÈË ÈÏ Îª Ìø ¹ý Òý µ¼ ¼¶ ±ð ÊÇ Ò» ÖÖ »µ Ï° ¹ß.
Ëû ÃÇ ½Ó ÊÜ H1 H2
H1 ·½ ʽ ¶ø Þð ÆÁ Ìø ¹ý H2
µÄ H1 H3
H1 ·½ ʽ.
ADDRESS ÔªËØ
<!ELEMENT ADDRESS - - ((%inline;) | P)*>
<!ATTLIST ADDRESS
%attrs; -- %coreattrs, %i18n, %events --
>
¿ª ʼ ±ê ¼Ç: Ðè Òª, ½á Êø ±ê ¼Ç: Ðè Òª
ÔÚ Ëü ´¦ ¶¨ Òå µÄ ÌØ ÐÔ
-
id, class
(¹ã·ºµÄÎĵµ±êʶ·û)
-
lang (ÓïÑÔÐÅÏ¢),
dir (ÎÄ×Ö·½Ïò)
-
onclick, ondblclick,
onmousedown,
onmouseup,
onmouseover,
onmousemove,
onmouseout,
onkeypress,
onkeydown,
onkeyup (ÄÚ²¿Ê¼þ)
Òò Ϊ û ÓÐ ¸ü ºÃ µÄ λ ÖÃ, ÎÒ ÃÇ Ö» ÄÜ ÔÚ ´Ë ¶¨ Òå
ADDRESS.
Õâ ¸ö Ôª ËØ ÔÚ ÎÄ µµ ÖÐ ¼Ó Èë ×÷ Õß ºÍ ½» »¥ ЊϢ, Èç:
<ADDRESS>
Newsletter editor<BR>
J. R. Brown<BR>
8723 Buena Vista, Smallville, CT 01234<BR>
Tel: +1 (123) 456 7890
</ADDRESS>