intTypePromotion=1

Đại Cương Về Thiết Kế Web Và Lập Trình Web- P3

Chia sẻ: Cong Thanh | Ngày: | Loại File: PDF | Số trang:5

0
214
lượt xem
127
download

Đại Cương Về Thiết Kế Web Và Lập Trình Web- P3

Mô tả tài liệu
  Download Vui lòng tải xuống để xem tài liệu đầy đủ

Đại Cương Về Thiết Kế Web Và Lập Trình Web- P3: Giáo trình bao gồm 5 chương, mỗi chương đều có phần kiến thức lý thuyết và câu hỏi nghiên cứu cụ thể...

Chủ đề:
Lưu

Nội dung Text: Đại Cương Về Thiết Kế Web Và Lập Trình Web- P3

  1. http://www.ebook.edu.vn 11 Ch−¬ng 2 LËp tr×nh Web víi ng«n ng÷ ®¸nh dÊu siªu v¨n b¶n (HTML) 2.1 Kh¸i niÖm ng«n ng÷ HTML HTML viÕt t¾t cña HyperText Mark-up Language (ng«n ng÷ ®¸nh dÊu siªu v¨n b¶n). Cã thÓ ®Þnh nghÜa HTML: Lµ mét tËp hîp c¸c quy t¾c vµ c¸c thÎ (tag) ®−îc sö dông ®Ó quy ®Þnh c¸c thøc tr×nh bµy, hiÓn thÞ néi dung cña c¸c trang Web, tËp hîp c¸c quy t¾c vµ thÎ nµy ph¶i tu©n theo mét chuÈn quèc tÕ, ®¶m b¶o cho c¸c tr×nh duyÖt Web kh¸c nhau,trªn c¸c nÒn phÇn cøng vµ hÖ ®iÒu hµnh kh¸c nhau ®Òu hiÓu ®−îc vµ hiÓn thÞ ®óng néi dung cña c¸c trang Web. HTML kh«ng ph¶i lµ mét ng«n ng÷ lËp tr×nh, nã lµ mét ng«n ng÷ ®¸nh dÊu. HTML dÔ hiÓu h¬n nhiÒu so víi hÇu hÕt c¸c ng«n ng÷ lËp tr×nh. Mét tµi liÖu HTML lµ mét tÖp tin v¨n b¶n trong ®ã cã sö dông c¸c thÎ HTML ®Ó quy ®Þnh c¸ch thøc hiÓn thÞ v¨n b¶n khi nã ®−îc më bëi mét tr×nh duyÖt Web. C¬ b¶n c¸c thÎ ®Þnh d¹ng trong HTML th−êng cã tõng cÆp gåm: thÎ më vµ thÎ ®ãng . C¸c v¨n b¶n n»m gi÷a hai thÎ nµy sÏ ®−îc chÞu t¸c ®éng ®Þnh d¹ng bëi thÎ. VÝ dô, thÎ dïng ®Ó ®Þnh d¹ng ch÷ in ®Ëm, khi ®ã v¨n b¶n "Hello" sÏ ®−îc hiÓn thÞ lµ "Hello". 2.2 LËp tr×nh web víi ng«n ng÷ HTML 2.2.1 C¸c thÎ ®Þnh d¹ng cÊu tróc cña HTML C¸c thÎ x¸c ®Þnh cÊu tróc tµi liÖu lµ b¾t buéc ph¶i cã trong mét tµi liÖu HTML. Sau ®©y chóng ta sÏ lÇn l−ît häc c¸ch sö dông c¸c thÎ ®Þnh d¹ng cÊu tróc cña mét tµi liÖu HTML c¬ b¶n. a. HTML CÆp thÎ nµy ®−îc sö dông ®Ó x¸c nhËn mét tµi liÖu lµ tµi liÖu HTML, tøc lµ nã cã sö dông c¸c thÎ HTML ®Ó tr×nh bµy. Toµn bé néi dung cña tµi liÖu ®−îc ®Æt gi÷a cÆp thÎ nµy. TÊt c¶ c¸c tËp tin HTML ®Òu b¾t ®Çu b»ng thÎ , thÎ nµy th«ng b¸o cho tr×nh duyÖt Web biÕt r»ng nã ®ang ®äc mét tµi liÖu cã chøa c¸c m· HTML vµ cuèi c¸c tËp tin HTML sÏ lµ thÎ ®ãng t−¬ng øng th«ng b¸o kÕt thóc mét tµi liÖu HTML. Có ph¸p: ... Toµn bé néi dung cña tµi liÖu ®−îc ®Æt ë ®©y Tr×nh duyÖt sÏ xem c¸c tµi liÖu kh«ng sö dông thÎ nh− nh÷ng tÖp v¨n b¶n b×nh th−êng. b. HEAD Mét tµi liÖu HTML gåm cã 2 phÇn: phÇn më ®Çu vµ phÇn néi dung chÝnh. PhÇn më ®Çu gièng nh− phÇn giíi thiÖu, c¸c tr×nh duyÖt Web sö dông phÇn më ®Çu nµy ®Ó thu nhÆt c¸c th«ng tin kh¸c nhau vÒ tµi liÖu HTML nµy, ch¼ng h¹n nh− tiªu
  2. http://www.ebook.edu.vn 12 ®Ò cña tµi liÖu, c¸c quan hÖ ®−îc thiÕt lËp gi÷a tµi liÖu vµ c¸c th− môc. ThÎ ®−îc dïng ®Ó x¸c ®Þnh phÇn më ®Çu cho tµi liÖu. Có ph¸p: ... PhÇn më ®Çu (header) cña tµi liÖu ®−îc ®Æt ë ®©y c. TITLE Chóng ta cã thÓ ®Æt tiªu ®Ò cho tµi liÖu HTML cña m×nh. Tiªu ®Ò nµy sÏ ®−îc hiÓn thÞ trªn thanh tiªu ®Ò cña tr×nh duyÖt. CÆp thÎ nµy chØ cã thÓ sö dông trong phÇn më ®Çu cña tµi liÖu, tøc lµ nã ph¶i n»m trong thÎ ph¹m vi giíi h¹n bëi cÆp thÎ . Có ph¸p: Tiªu ®Ò cña tµi liÖu ®−îc ®Æt ë ®©y d. BODY ThÎ nµy ®−îc sö dông ®Ó x¸c ®Þnh phÇn néi dung chÝnh cña tµi liÖu. Còng cã thÓ sö dông c¸c tham sè cña thÎ ®Ó ®Æt ¶nh nÒn cho tµi liÖu, mµu nÒn, mµu v¨n b¶n siªu liªn kÕt, ®Æt lÒ cho trang tµi liÖu… Nh÷ng th«ng tin nµy ®−îc ®Æt ë phÇn tham sè cña thÎ. Có ph¸p: .... phÇn néi dung cña tµi liÖu ®−îc ®Æt ë ®©y Trªn ®©y lµ có ph¸p c¬ b¶n cña thÎ , tuy nhiªn b¾t ®Çu tõ phiªn b¶n HTML 3.2 th× cã nhiÒu thuéc tÝnh ®−îc sö dông trong thÎ . Nh− vËy mét tµi liÖu HTML c¬ b¶n cã cÊu tróc nh− sau: Tiªu ®Ò cña tµi liÖu ... Néi dung cña tµi liÖu Sau ®©y lµ c¸c thuéc tÝnh chÝnh: BACKGROUND= §Æt mét ¶nh nµo ®ã lµm ¶nh nÒn (background) cho v¨n b¶n. Gi¸ trÞ cña tham sè nµy (phÇn sau dÊu b»ng) lµ URL cña file ¶nh. NÕu kÝch th−íc ¶nh nhá h¬n cöa sæ tr×nh duyÖt th× toµn bé mµn h×nh cöa sæ tr×nh duyÖt sÏ ®−îc l¸t kÝn b»ng nhiÒu ¶nh.
  3. http://www.ebook.edu.vn 13 BGCOLOR= §Æt mÇu nÒn cho trang khi hiÓn thÞ. NÕu c¶ hai tham sè BACKGROUND vµ BGCOLOR cïng cã gi¸ trÞ th× tr×nh duyÖt sÏ hiÓn thÞ mÇu nÒn tr−íc, sau ®ã míi t¶i ¶nh lªn phÝa trªn. TEXT= X¸c ®Þnh mµu ch÷ cña v¨n b¶n, kÓ c¶ c¸c ®Ò môc. ALINK= X¸c ®Þnh mµu s¾c cho c¸c siªu liªn kÕt trong v¨n b¶n. VLINK= T−¬ng øng, alink (active link) lµ liªn kÕt ®ang ®−îc kÝch LINK= ho¹t - tøc lµ khi ®· ®−îc kÝch chuét lªn; vlink (visited link) chØ liªn kÕt ®· tõng ®−îc kÝch ho¹t; e. Chó thÝch CÆp thÎ nµy cho phÐp ng−êi biªn so¹n tµi liÖu HTML cã thÓ thªm vµo trong c¸c tµi liÖu HTML nh÷ng chó thÝch cÇn thiÕt, hoÆc cã thÓ sö dông cÆp thÎ nµy ®Ó th«ng b¸o cho tr×nh duyÖt bá qua mét ®o¹n m· lÖnh HTML. C¸c v¨n b¶n ®−îc ®Æt gi÷a hai thÎ nµy sÏ kh«ng ®−îc tr×nh duyÖt hiÓn thÞ. Có ph¸p: 2.2.2 C¸c thÎ ®Þnh d¹ng khèi a. ThÎ ThÎ ®−îc sö dông ®Ó ®Þnh d¹ng mét ®o¹n v¨n b¶n. Có ph¸p: Néi dung ®o¹n v¨n b¶n b. C¸c thÎ ®Þnh d¹ng ®Ò môc H1/H2/H3/H4/H5/H6 HTML hç trî 6 møc ®Ò môc. Chó ý r»ng ®Ò môc chØ lµ c¸c chØ dÉn ®Þnh d¹ng vÒ mÆt logic, tøc lµ mçi tr×nh duyÖt sÏ thÓ hiÖn ®Ò môc d−íi mét khu«n d¹ng thÝch hîp. Cã thÓ ë tr×nh duyÖt nµy lµ font ch÷ 14 point nh−ng sang tr×nh duyÖt kh¸c lµ font ch÷ 20 point. §Ò môc cÊp 1 lµ cao nhÊt vµ gi¶m dÇn ®Õn cÊp 6. Th«ng th−êng v¨n b¶n ë ®Ò môc cÊp 5 hay cÊp 6 th−êng cã kÝch th−íc nhá h¬n v¨n b¶n th«ng th−êng. D−íi ®©y lµ c¸c thÎ dïng ®Ó ®Þnh d¹ng v¨n b¶n ë d¹ng ®Ò môc: ... §Þnh d¹ng ®Ò môc cÊp 1 ... §Þnh d¹ng ®Ò môc cÊp 2 ... §Þnh d¹ng ®Ò môc cÊp 3 ... §Þnh d¹ng ®Ò môc cÊp 4 ... §Þnh d¹ng ®Ò môc cÊp 5 ... §Þnh d¹ng ®Ò môc cÊp 6
  4. http://www.ebook.edu.vn 14 c. ThÎ xuèng dßng ThÎ nµy kh«ng cã thÎ kÕt thóc t−¬ng øng (), nã cã t¸c dông chuyÓn sang dßng míi. L−u ý, néi dung v¨n b¶n trong tµi liÖu HTML sÏ ®−îc tr×nh duyÖt Web thÓ hiÖn liªn tôc, c¸c kho¶ng tr¾ng liÒn nhau, c¸c ký tù tab, ký tù xuèng dßng ®Òu ®−îc coi nh− mét kho¶ng tr¾ng. §Ó xuèng dßng, ta ph¶i sö dông thÎ . d. 2.4 ThÎ §Ó giíi h¹n ®o¹n v¨n b¶n ®· ®−îc ®Þnh d¹ng s½n ta cã thÓ sö dông thÎ . V¨n b¶n ë gi÷a hai thÎ nµy sÏ ®−îc thÓ hiÖn gièng hÖt nh− khi chóng ®−îc ®¸nh vµo, vÝ dô dÊu xuèng dßng trong ®o¹n v¨n b¶n giíi h¹n bëi thÎ sÏ cã ý nghÜa chuyÓn sang dßng míi (tr×nh duyÖt sÏ kh«ng coi chóng nh− dÊu c¸ch). Có ph¸p: V¨n b¶n ®· ®−îc ®Þnh d¹ng 2.2.3 C¸c thÎ ®Þnh d¹ng danh s¸ch Có ph¸p: Môc thø nhÊt Môc thø hai Cã 4 kiÓu danh s¸ch: • Danh s¸ch kh«ng s¾p xÕp ( hay kh«ng ®¸nh sè) • Danh s¸ch cã s¾p xÕp (hay cã ®¸nh sè) , mçi môc trong danh s¸ch ®−îc s¾p xÕp thø tù. • Danh s¸ch thùc ®¬n • Danh s¸ch ph©n cÊp Víi nhiÒu tr×nh duyÖt, danh s¸ch ph©n cÊp vµ danh s¸ch thùc ®¬n gièng danh s¸ch kh«ng ®¸nh sè, cã thÓ dïng lÉn víi nhau. Víi thÎ OL ta cã có ph¸p sau: Muc thu nhat Muc thu hai Muc thu ba Trong ®ã: TYPE =1 C¸c môc ®−îc s¾p xÕp theo thø tù 1, 2, 3... =a C¸c môc ®−îc s¾p xÕp theo thø tù a, b, c... =A C¸c môc ®−îc s¾p xÕp theo thø tù A, B, C... =i C¸c môc ®−îc s¾p xÕp theo thø tù i, ii, iii... =I C¸c môc ®−îc s¾p xÕp theo thø tù I, II, III... Ngoµi ra cßn thuéc tÝnh START= x¸c ®Þnh gi¸ trÞ khëi ®Çu cho danh s¸ch. ThÎ cã thuéc tÝnh TYPE= x¸c ®Þnh ký hiÖu ®Çu dßng (bullet) ®øng tr−íc mçi môc trong danh s¸ch. Thuéc tÝnh nµy cã thÓ nhËn c¸c gi¸ trÞ : disc (chÊm trßn ®Ëm); circle (vßng trßn); square (h×nh vu«ng).
  5. http://www.ebook.edu.vn 15 2.2.4 C¸c thÎ ®Þnh d¹ng ký tù a. C¸c thÎ ®Þnh d¹ng in ký tù Sau ®©y lµ c¸c thÎ ®−îc sö dông ®Ó quy ®Þnh c¸c thuéc tÝnh nh− in nghiªng, in ®Ëm, g¹ch ch©n... cho c¸c ký tù, v¨n b¶n khi ®−îc thÓ hiÖn trªn tr×nh duyÖt. ThÎ Thuéc tÝnh ... In ch÷ ®Ëm ... ... In ch÷ nghiªng ... ... In ch÷ g¹ch ch©n §¸nh dÊu ®o¹n v¨n b¶n gi÷a hai thÎ nµy lµ ®Þnh nghÜa cña mét tõ. Chóng th−êng ®−îc in nghiªng hoÆc thÓ hiÖn qua mét kiÓu ®Æc biÖt nµo ®ã. ... In ch÷ bÞ g¹ch ngang. ... ... In ch÷ lín h¬n b×nh th−êng b»ng c¸ch t¨ng kÝch th−íc font hiÖn thêi lªn mét. ViÖc sö dông c¸c thÎ lång nhau t¹o ra hiÖu øng ch÷ t¨ng dÇn. Tuy nhiªn ®èi víi mçi tr×nh duyÖt cã giíi h¹n vÒ kÝch th−íc ®èi víi mçi font ch÷, v−ît qu¸ giíi h¹n nµy, c¸c thÎ sÏ kh«ng cã ý nghÜa. ... In ch÷ nhá h¬n b×nh th−êng b»ng c¸ch gi¶m kÝch th−íc font hiÖn thêi ®i mét. ViÖc sö dông c¸c thÎ lång nhau t¹o ra hiÖu øng ch÷ gi¶m dÇn. Tuy nhiªn ®èi víi mçi tr×nh duyÖt cã giíi h¹n vÒ kÝch th−íc ®èi víi mçi font ch÷, v−ît qu¸ giíi h¹n nµy, c¸c thÎ sÏ kh«ng cã ý nghÜa. ... §Þnh d¹ng chØ sè trªn (SuperScript) ... §Þnh d¹ng chØ sè d−íi (SubScript) §Þnh nghÜa kÝch th−íc font ch÷ ®−îc sö dông cho ®Õn hÕt v¨n b¶n. ThÎ nµy chØ cã mét tham sè size= x¸c ®Þnh cì ch÷. ThÎ kh«ng cã thÎ kÕt thóc. ... Chän kiÓu ch÷ hiÓn thÞ. Trong thÎ nµy cã thÓ ®Æt hai tham sè size= hoÆc color= x¸c ®Þnh cì ch÷ vµ mµu s¾c ®o¹n v¨n b¶n n»m gi÷a hai thÎ. KÝch th−íc cã thÓ lµ tuyÖt ®èi (nhËn gi¸ trÞ tõ 1 ®Õn 7) hoÆc t−¬ng ®èi (+2,-4...) so víi font ch÷ hiÖn t¹i.
ADSENSE
ADSENSE

CÓ THỂ BẠN MUỐN DOWNLOAD

 

Đồng bộ tài khoản
2=>2