Download HTML Document Structure and Metadata and more Cheat Sheet Computer science in PDF only on Docsity!
CuĂšn sžch huĂng dĂn sö dĂŽng Ng«n ngĂ· siÂȘu všn b¶n ( html ) lÎŒ mĂ©t cuĂšn sžch dĂŻng cho nhĂ·ng ai mĂi lĂn ÂźĂu tiĂp xĂłc vĂi ng«n ngĂ· nÎŒy. NĂ©i dung tĂp trung vĂ nhĂ·ng vĂn Ÿà cÂŹ b¶n trong ng«n ngĂ· siÂȘu všn b¶n, nĂŁ cung cĂp cho chĂłng ta mĂ©t cži nhĂn ban ÂźĂu vĂ ng«n ngĂ· siÂȘu všn b¶n, tĂ” Ÿã Ÿéc gi¶ kh«ng ph¶i ngĂŹ ngÎŒng khi tiĂp tĂŽc nghiÂȘn cĂžu tiĂp nhĂ·ng vĂn Ÿà n©ng cao hÂŹn. BÂčn cĂŁ thà ŸÀc vÎŒ vĂn dĂŽng mĂ©t cžch nhanh chĂŁng nhĂ·ng vĂn Ÿà ŸuĂźc bÎŒn luĂn trong tĂp tÎŒi liĂu nÎŒy.Tuy nhiÂȘn nhĂ·ng gà Ÿà cĂp Ă« Ÿ©y chĂ lÎŒ nhĂ·ng vĂn Ÿà cÂŹ b¶n ban ÂźĂu.§à tĂm hiĂu thÂȘm, bÂčn cĂn tham kh¶o thÂȘm Ă« nhĂ·ng cuĂšn sžch khžc chi tiĂt hÂŹn cĂČng nh bÂčn cĂn tĂč nghiÂȘn cĂžu thÂȘm. Kh«ng cĂŁ gĂ tĂšt hÂŹn lÎŒ Âźi vÎŒo thĂčc tĂ nh ngĂȘi ta thĂȘng b¶o:"MuĂšn biĂt bÂŹi thĂ ph¶i nh¶y xuĂšng nuĂc". ChĂłc bÂčn ÂźÂčt Ÿßc nhĂ·ng Ăc muĂšn khi ŸÀc cuĂšn sžch nÎŒy.
Cžc thÎŒnh phĂn xžc ÂźĂnh cĂu trĂłc dĂ· liĂu lÎŒ cžc thÎŒnh phĂn bŸt buĂ©c ph¶i cĂŁ trong mĂ©t tÎŒi liĂu siÂȘu všn b¶n HTML. NgoÎŒi thÎŒnh phĂn mĂ« ÂźĂu xžc ÂźĂnh tÂȘn vÎŒ mĂ©t sĂš thuĂ©c tĂnh Ÿà ph©n biĂt giĂ·a cžc tÎŒi liĂu, chĂ cĂŁ cžc thÎŒnh phĂn liĂt kÂȘ dĂi Ÿ©y lÎŒ bŸt buĂ©c ŸÚi vĂi mçi mĂ©t tÎŒi liĂu HTML Ÿà phĂŻ hĂźp vĂi chuĂn chung. NhĂ·ng tĂ” khož thiĂt yĂu nÎŒy bao gĂ„m:
**1. ...
- ...
- ...**
B©y giĂȘ ta Âźi vÎŒo chi tiĂt cžc tĂ” khož nÎŒy:
...
a. CĂp tĂ” khož nÎŒy giĂłp nhĂn dÂčng ra r»ng tÎŒi liĂu cĂŁ chĂža cžc thÎŒnh phĂn tu©n thñ theo chuĂn vĂ ng«n ngĂ· siÂȘu všn b¶n. ThÎŒnh phĂn nÎŒy ph¶i n»m tiĂp ngay sau phĂn mĂ« ÂźĂu vÎŒ cĂp tĂ” khož cĂŁ tžc dĂŽng giĂi hÂčn toÎŒn bĂ© phĂn nĂ©i dung cĂn lÂči, kĂ c¶ cžc thÎŒnh phĂn khžc.
b. MĂ©t tÎŒi liĂu ph¶i cĂŁ dÂčng tĂŠng qužt sau:
toÎŒn bĂ© nĂ©i dung tÎŒi liĂu, kĂ c¶ cžc thÎŒnh phĂn khžc ÂźĂu n»m Ă« Ÿ©y.
c. CĂp tĂ” khož ... kh«ng Ÿßc hiĂn thĂ lÂȘn bĂ«i cžc bĂ© duyĂt vÎŒ chà Ÿßc chĂža cžc thÎŒnh phĂn vÎŒ .
...
a. ThÎŒnh phĂn mĂ« ÂźĂu cña mĂ©t tÎŒi liĂu HTML lÎŒ mĂ©t su tĂp kh«ng sŸp xĂp cžc th«ng tin vĂ tÎŒi liĂu Ÿã.Trong Ÿã cĂp tĂ” khož ÂźĂt tiÂȘu Ÿà cĂČng lÎŒ bŸt buĂ©c:
GiĂi thiĂu vĂ HTML
b. CĂp tĂ” khĂŁa vÎŒ kh«ng trĂčc tiĂp ¶nh hĂ«ng tĂi cžch thĂ hiĂn tÎŒi liĂu khi ta xem b»ng bĂ© duyĂt. c. Cžc thÎŒnh phĂn sau Ÿ©y liÂȘn quan tĂi thÎŒnh phĂn mĂ« ÂźĂu tÎŒi liĂu, tuy kh«ng trĂčc tiĂp "tÂčo džng"nhng ( nĂu sö dĂŽng ) lÂči cung cĂp nhĂ·ng th«ng tin quan trĂ€ng ŸÚi vĂi bĂ© duyĂt:
-cho phĂp khai bžo ÂźĂa chĂ cÂŹ sĂ« cña tÎŒi liĂu. -Cho phĂp tĂm kiĂm trong tÎŒi liĂu theo tĂ” khož. -ChĂ ra cžc mĂši quan hĂ giĂ·a cžc tÎŒi liĂu. -TÂčo tÂȘn gĂ€i ŸÄng nhĂt hož cho tÎŒi liĂu. -Cung cĂp th«ng tin hĂ·u Ăch cho chà Ÿé truy nhĂp server/clients
o Cho phĂp bĂ© tĂm tÎŒi liĂu nguyÂȘn ŸÄng dÂčng ( URL-Uniform Resource Locator ) cña chĂnh tÎŒi liĂu nÎŒy Ÿßc ghi chĂp lÂči trong nhng tĂnh huĂšng tÎŒi liĂu cĂŁ thĂ bĂ tra lÂčc ÂźĂ.Cžc URL trong tÎŒi liĂu cĂŁ thĂ cĂŁ dÂčng cĂŽc bĂ© mĂ©t cžch tÂŹng ŸÚi quy chiĂu trÂȘn ÂźĂa chĂ nÎŒy. Chç nÎŒo ÂźĂa chĂ cÂŹ sĂ« kh«ng Ÿßc chĂ rĂą,bĂ© duyĂt sĂ lĂy URL mÎŒ nĂŁ Ÿ· dĂŻng Ÿà truy ÂźĂn tÎŒi liĂu lÎŒm cÂŹ sĂ« hož gi¶i cžc URL
o DĂŻng Ÿà Ÿa vÎŒo tÎŒi liĂu nhĂ·ng th«ng tin phĂŽ kh«ng ÂźĂnh nghĂa Ÿßc b»ng cžc thÎŒnh phĂn khžc cña HTML. ThĂȘng Âźi kĂm vĂi HTTP- EQUIV, NAME, CONTENT. NĂŁi chung chĂ cĂŁ Ăœ nghĂa trong tÎŒi liĂu Ÿéng ( thĂȘng hay thay ŸÊi ).
...
ChĂža tĂt c¶ cžc thÎŒnh phĂn khžc cĂČng nh nĂ©i dung tĂ” lĂȘi všn ÂźĂn hĂnh ¶nh cĂu thÎŒnh nÂȘn mĂ©t tÎŒi liĂu, song kh«ng dĂnh džng ÂźĂn sĂč bÎŒi trĂ cña tÎŒi liĂu Ÿã ( chĂ lÎŒ dĂu hiĂu mĂ« ÂźĂu vÎŒ kĂt thĂłc ).
...
§žnh dĂu cĂŽm tĂ” chĂ ÂźĂn mĂ©t kĂt nĂši siÂȘu všn b¶n ( hypertext link ) mÎŒ khi trĂĄ tĂi nĂŁ, bĂ© duyĂt sĂ dĂn dŸt ÂźĂn mĂ©t tÎŒi liĂu hay mĂ©t ÂźoÂčn všn b¶n khžc. CĂŁ nhiĂu thuĂ©c tĂnh nhng hoĂc NAME hoĂc HREF lÎŒ cžc thuĂ©c tĂnh bŸt buĂ©c.
HREF NĂu cĂŁ HREF, cĂŽm tĂ” ŸÞng giĂ·a sĂ thÎŒnh siÂȘu všn b¶n, nghĂa lÎŒ nĂŁ trĂĄ ÂźĂn mĂ©t všn b¶n khžc chĂž kh«ng chĂ mang nĂ©i dung thuĂn tuĂœ. Khi chĂ€n vÎŒo cĂŽm tĂ” Ÿã, mĂ©t tÎŒi liĂu khžc hoĂc ÂźoÂčn tÎŒi liĂu khžc trong cĂŻng mĂ©t tÎŒi liĂu Âźang xem mÎŒ ÂźĂa chà Ÿßc chĂ ra bĂ«i giž trĂ cña thuĂ©c tĂnh HREF sà Ÿßc hiĂn lÂȘn.
VĂ dĂŽ: Xem phĂn Gi¶i thĂch Ÿà biĂt thÂȘm chi tiĂt.
Trong vĂ dĂŽ trÂȘn, khi chĂ€n vÎŒo Gi¶i thĂch , trang tÎŒi liĂu tĂ” mžy chñ cĂŁ ÂźĂa chĂ 190.2.0.1 cĂŁ tÂȘn lÎŒ gthich.htm sà Ÿßc lĂy vĂ vÎŒ hiĂn thĂ trÂȘn mÎŒn hĂnh bĂ«i bĂ© duyĂt.
DĂŻng dÂčng HREF="#tÂȘn_gĂ€i" Ÿà chĂ ÂźĂn mĂ©t ÂźiĂm mĂŁc nĂši khžc trong cĂŻng tÎŒi liĂu Âźang xĂt. VĂ dĂŽ: PhĂn glossary gi¶i thĂch cžc thuĂt ngĂ· dĂŻng trong tÎŒi liĂu.
Trong vĂ dĂŽ nÎŒy, khi chĂ€n vÎŒo glossary Âźa ta ÂźĂn mĂ©t ÂźiĂm mĂŁc nĂši khžc (Ÿßc ÂźĂnh nghĂa b»ng ...) trong cĂŻng tÎŒi liĂu cĂŁ tÂȘn lÎŒ tailieu.htm. NĂu ÂźiĂm mĂŁc nĂši lÂči Ă« tÎŒi liĂu khžc, HREF cĂŁ thĂ lÎŒ URL tÂŹng ŸÚi so vĂi ÂźĂa chĂ cña tÎŒi liĂu hiĂn thĂȘi hay ÂźĂa chĂ cÂŹ sĂ« Ÿ· Âź- Ăźc xžc ÂźĂnh ( b»ng Ă« trÂȘn). NAME DĂŻng Ÿà ŸĂt tÂȘn cho ÂźiĂm mĂŁc nĂši vÎŒ vĂ vĂy ph¶i lÎŒ duy nhĂt trong nĂ©i bĂ© tÎŒi liĂu hiĂn thĂȘi mĂc dĂŻ tÂȘn cĂŁ thĂ ÂźĂt tuĂș Ăœ.
VĂ dĂŽ: CÎŒ phÂȘ lÎŒ mĂ©t vĂ dĂŽ vĂ loÂči c©y...
MĂ©t vĂ dĂŽ vĂ loÂči c©y nÎŒy lÎŒ cÎŒ phÂȘ .
TĂ” tÎŒi liĂu khžc cĂŁ thĂ tham chiĂu tĂi b»ng cžch ÂźĂt tÂȘn gĂ€i vÎŒo sau ÂźĂa chĂ , ngšn cžch b»ng mĂ©t dĂu #. VĂ dĂŽ:
TITLE ThuĂ©c tĂnh nÎŒy chĂ cĂŁ Ăœ nghĂa th«ng bžo vÎŒ Ÿßc dĂŻng Ÿà ŸĂt ÂźĂu Ÿà cho tÎŒi liĂu mÎŒ ÂźĂa chĂ do HREF chĂ ra. §Ău Ÿà cĂn ph¶i lÎŒ duy nhĂt ŸÚi vĂi tÎŒi liĂu ÂźĂch. NĂŁ cĂŁ Ăch Ăt nhĂt lÎŒ trong hai trĂȘng hĂźp sau:
o BĂ© duyĂt cĂŁ thĂ hiĂn ÂźĂu Ÿà cña tÎŒi liĂu trĂc khi lĂy vĂ, chÂŒng hÂčn nh mĂ©t ghi chĂł nhĂĄ bÂȘn lĂ hay trong mĂ©t khung nhĂĄ khi con trĂĄ chuĂ©t di qua ÂźiĂm mĂŁc nĂši (cĂŁ thĂ lÎŒ mĂ©t cĂŽm tĂ” hay mĂ©t hĂnh ¶nh), hay khi Âźang t¶i tÎŒi liĂu ra (nhĂt lÎŒ khi qua ÂźĂȘng truyĂn cĂŁ tĂšc Ÿé kh«ng cao lŸm). Cžc thÎŒnh phĂn ÂźĂnh dÂčng khĂši dĂŻng Ÿà tÂčo dÂčng cña mĂ©t doÂčn všn b¶n vÎŒ ph¶i n»m trong phĂn th©n cña tÎŒi liĂu. CĂŁ nhĂ·ng cĂp tĂ” khož quan trĂ€ng sau Ÿ©y: ... -§Ănh dÂčng phĂn ÂźĂa chĂ. ... -§Ănh dÂčng sžu mĂžc tiÂȘn ÂźĂ. **** -§ĂȘng ph©n cžch ngang tÎŒi liĂu. ...
-GiĂi hÂčn mĂ©t paragraph.
ChĂ lÎŒ giĂi hÂčn mĂ©t paragraph. Cžch bÎŒi trĂ do cžc thÎŒnh phĂn khžc tÂčo thÎŒnh. ThĂȘng chĂ cĂŁ kho¶ng trĂšng kho¶ng mĂ©t dĂng hay nöa dĂng trĂc paragraph, trĂ” khi n»m trong phĂn ÂźĂa chĂ ( trong ... ). MĂ©t sĂš bĂ© duyĂt thĂ hiĂn dĂng ÂźĂu cña paragraph thĂŽt vÎŒo.
VĂ dĂŽ: TiÂȘu Ÿà cña Paragraph
§oÂčn všn b¶n thuĂ©c vĂ paragraph thĂž nhĂt.
§oÂčn všn b¶n thuĂ©c vĂ paragraph thĂž hai.MĂc dĂŻ kh«ng nhĂt thiĂt ph¶i bŸt ÂźĂu b»ng dĂng mĂi, song dĂŻng cžch nÎŒy giĂłp cho viĂc "lu trĂ·" tÎŒi liĂu dĂ dÎŒng hÂŹn.
§oÂčn všn b¶n thĂž ba. **Ghi chĂł: HTML 3.0** mĂ« rĂ©ng tĂ” khož nÎŒy vĂi thuĂ©c tĂnh cšn lĂ. **
** BŸt buĂ©c xuĂšng dĂng tÂči vĂ trĂ gĂp tĂ” khož nÎŒy. DĂng mĂi Ÿßc cšn lĂ nh dĂng Ÿßc bĂ tĂč Ÿéng khi dĂng Ÿã quž dÎŒi. VĂ dĂŽ:
Smile
an everlasting smile
a smile could bring you near to me
**_Ghi chó:_** **Netscape** më réng
. **... ...** DĂŻng Ÿà trĂch dĂn mĂ©t ÂźoÂčn všn b¶n, thĂȘng Ÿßc thĂ hiĂn b»ng chĂ· nghiÂȘng cĂŁ cšn lĂ lĂŻi vÎŒo trong ( nh mĂ©t paragraph ) vÎŒ thĂȘng cĂŁ mĂ©t dĂng trĂšng trÂȘn vÎŒ dĂi.
VĂ dĂŽ: I think the poem ends
Soft you now, the fair Ophelia. Nymph, in thy orisons, be all my sins remembered.
But I am not sure.
I think the poem ends
Soft you now, the fair Ophelia. Nymph, in thy orisons, be all my sins remembered. But I am not sure.
HTML hç trĂź nhiĂu kiĂu loÂči danh sžch , tĂt c¶ ÂźĂu cĂŁ thĂ lĂ„ng vÎŒo nhau vÎŒ chĂ nÂȘn dĂŻng trong phĂn th©n cña tÎŒi liĂu ( ... ).
... -Danh sžch ÂźĂnh nghĂa. ... -Danh sžch kiĂu th mĂŽc. ... -Danh sžch kiĂu thĂčc Ÿn. ... -Danh sžch cĂŁ sŸp xĂp. ... -Danh sžch kh«ng sŸp xĂp.
...
LĂp danh sžch cžc thuĂt ngĂ· vÎŒ ÂźĂnh nghĂa tÂŹng Ăžng.
VĂ dĂŽ:
TermThis is the difinition of the first term. TermThis is the difinition of the second term.
KĂt qu¶ cña vĂ dĂŽ trÂȘn:
Term This is the difinition of the first term. Term This is the difinition of the second term. **** Ÿà chĂ tÂȘn thuĂt ngĂ·, **** Ÿà chĂ phĂn ÂźĂnh nghĂa. Sau **** ph¶i lÎŒ ****. CĂŁ thĂ cĂŁ thÂȘm thuĂ©c tĂnh COMPACT Ÿà chĂ dĂn thÂȘm lÎŒ xĂp **** vÎŒ **** theo tĂ”ng cĂp. LĂłc Ÿã sĂ ph¶i viĂt lÎŒ **** vÎŒ tiĂp theo cĂČng vĂn ph¶i lÎŒ **** :
TermThis is the difinition of the first term. TermThis is the difinition of the second term.
o Third item in the list.
...
Danh sžch cĂŁ sŸp xĂp theo trĂnh tĂč hay mĂžc Ÿé quan trĂ€ng. Sau **** ph¶i lÎŒ **** ( list item ) vÎŒ cĂŁ thĂ cĂŁ thÂȘm thuĂ©c tĂnh COMPACT.
First list item. Second list item. Third list item.
- First list item.
- Second list item.
- Third list item.
... CĂČng nh **** nhng danh sžch kh«ng hĂ cĂŁ sŸp xĂp.
VĂ dĂŽ:
First list item. Second list item. Third list item.
Cho kĂt qu¶:
o First list item. o Second list item. o Third list item Khai bžo loÂči th«ng tin: ... -TrĂch dĂn. ... -VĂ dĂŽ vĂ m· lĂnh. ... -NhĂn mÂčnh. ... -KĂ tĂč do ngĂȘi dĂŻng gĂą vÎŒo trÂȘn bÎŒn phĂm. ... -NguyÂȘn všn.
... -RĂt nhĂn mÂčnh. ... -ChĂ tÂȘn biĂn hay tham sĂš. §Ănh dÂčng mĂu kĂ tĂč: ... -ChĂ· ÂźĂm. ... -ChĂ· nghiÂȘng. ... -ChĂ· Ÿžnh trÂȘn mžy chĂ·. ... This sentence, containing a citation reference would look like: This sentence, containing a citation reference would look like: ... DĂŻng Ÿà chĂ ra mĂ©t ÂźoÂčn chÂŹng trĂnh nguĂ„n ( m· lĂnh ). CĂn ph©n biĂt vĂi všn b¶n ÂźĂnh dÂčng sÂœn ( Preformatted Text ).VĂ dĂŽ:
This sentence contains an example of code . It would look like: This sentence contains an example of code. It would look like: ... TĂ” khož nÎŒy dĂŻng Ÿà nhĂn mÂčnh, chÂŒng hÂčn:
The Emphasis element tyically tenders as Italics.
sĂ trĂ« thÎŒnh:
The Emphasis element tyically renders as Italics. ... ThĂȘng dĂŻng trong hĂng dĂn sö dĂŽng Ÿà chĂ r»ng kĂ tĂč lÎŒ do ngĂȘi dĂŻng gĂą vÎŒo:
The text inside the KBD element would typically renders as monospaced font.
sĂ thĂ hiĂn lÎŒ:
The text inside the KBD element would typically renders as monospaced font.
The instructions must be read before continuing. ... ThĂ hiĂn b»ng chĂ· nghiÂȘng (Italics):
Anything between the I elements should be Italics.
sĂ cho kĂt qu¶ lÎŒ:
Anything between the I elements should be Italics ... ChĂ ra r»ng nhĂ·ng kĂ tĂč gĂą b»ng mžy chĂ· hay teletip(teletype):
Text between the typetype elements should be rendered in fixed width typewriter font.
sĂ cho kĂt qu¶ lÎŒ:
Text between the typetype elements should be rendered in fixed width typewriter font. ...
DĂŻng Ÿà lĂ„ng hĂnh ¶nh vÎŒo tÎŒi liĂu. Kh«ng dĂŻng Ÿà chĂn siÂȘu všn b¶n khžc. CĂŁ thĂ cĂŁ thÂȘm nhĂ·ng thuĂ©c tĂnh sau:
Cšn lĂ trÂȘn ( TOP ) ,giĂ·a ( MIDDLE ), dĂi ( BOTTOM ) cžc kĂ tĂč všn b¶n ŸÚi vĂi hĂnh ¶nh:
DĂŻng trong trĂȘng hĂźp cĂŁ thĂ bĂ© duyĂt kh«ng hiĂu thà Ÿßc hĂnh ¶nh ph¶i hiĂn dĂng všn b¶n thay thĂ. VĂ dĂŽ: Be sure to read these instructions.
HĂnh ¶nh cĂŁ dÂčng mĂ©t b¶ng ŸÄ , nghĂa lÎŒ cĂŁ chĂža cžc vĂŻng Ÿßc "žnh xÂč" ÂźĂn nhĂ·ng URL vÎŒ khi bĂm vÎŒo cžc vĂ trĂ khžc nhau trÂȘn hĂnh ¶nh sĂ dĂn ÂźĂn cžc tÎŒi liĂu khžc nhau.VĂ dĂŽ:
§©y lÎŒ thuĂ©c tĂnh bŸt buĂ©c, vĂi cžc giž trĂ lÎŒ mĂ©t URL cña hĂnh ¶nh Ÿßc lĂ„ng vÎŒo. CĂł phžp cĂČng nh Ă« HREF trong thÎŒnh phĂn liÂȘn kĂt .VĂ dĂŽ: Be sure to read these instructions.
