Tài liệu này dành cho sinh viên, giáo viên khối ngành công nghệ thông tin tham khảo và có những bài học bổ ích hơn, bổ trợ cho việc tìm kiếm tài liệu, giáo án, giáo trình, bài giảng các môn học khối ngành công nghệ thông tin
Ngôn ngӳ HTML Phɞm Thɼ Bɠo Khoa Toán – Tin h͍c ptbao@hcmus.edu.vn http://www.math.hcmuns.edu.vn/~ptbao/TKW Giӟi thiӋu 9 HTML=HyperText Markup Language – Ngôn ngͯÿánh dɢu siêu văn bɠn – Ngôn ngͯÿʀ viɼt các trang web. 9 Do Tim Berner Lee phát minh và ÿɉͣc W3C (World Wide Web Consortium) ÿɉa thành chuɦn năm 1994. - Chӭa các thành phҫn ÿӏnh dҥng ÿӇ báo cho trình duyӋt Web biӃt cách hiӇn thӏ mӝt trang Web. - Mӝt trang web thông thѭӡng gӗm có 2 thành phҫn chính: Dӳ liӋu cӫa trang web (văn bҧn, âm thanh, hình ҧnh ) Các thҿ (tag) HTML dùng ÿӇ ÿӏnh dҥng mô tҧ cách thӭc các dӳ liӋu trên hiӇn thӏ trên trình duyӋt. - ĈӇ ÿӑc ÿѭӧc trang Web phҧi thông qua trình duyӋt Web (Web Browser). Ĉһc ÿiӇm 9 HTML sͭ dͥng các thɸ (tags) ÿʀ ÿʈnh dɞng dͯ liʄu 9 HTML không phân biʄt chͯ hoa, chͯ thɉ͝ng 9 Các trình duyʄt thɉ͝ng không báo l͗i cú pháp HTML. Nɼu viɼt sai cú pháp chʆ dɨn ÿɼn kɼt quɠ hiʀn thʈ không ÿúng v͛i dͱ ÿʈnh. Trang web ÿҫu tiên 9 Trang HTML có phɤn m͟ r͙ng (ÿuôi) là .HTM hoɴc .HTML 9 Có thʀ tɞo trang HTML bɮng bɢt cͩ trình soɞn thɠo “văn bɠn thuɤn” nào (Notepad, EditPlus,…) 9 Có nhiɾu trình soɞn thɠo HTML cho phép NSD soɞn thɠo trͱc quan, kɼt quɠ sinh ra HTML tɉɇng ͩng nhɉ: – Microsoft FrontPage – Macromedia Dreamweaver –… Trang web ÿҫu tiên (tt) 9 Soɞn thɠo: –M͟ trình soɞn thɠo văn bɠn thuɤn (VD Notepad) gõ ND dɉ͛i –Ghi lɞi v͛i tên “CHAO.HTM” hay “chao.html” <html> <head> <title>Chào bңn</title> </head> <body> Chào mӭng bңn ÿӁn vӝi <U>HTML</U>! </body> </html> Trang web ÿҫu tiên (tt) 9 Thͭ nghiʄm: –M͟ trình duyʄt web (IE) –Vào File/Open, ch͍n file CHAO.HTM vͫa ghi –Nhɢn OK ĺ Có kɼt quɠ nhɉ hình bên 9 Thay ÿ͕i: –Quay lɞi Notepad, sͭa lɞi n͙i dung trang web r͓i ghi lɞi – Chuyʀn sang IE, nhɢn nút Refresh (F5) ĺ thɢy kɼt quɠ m͛i 9 Ghi chú: Các thɸ ÿɉͣc nêu tiɼp theo mɴc ÿʈnh ÿɴt ͟ trong phɤn <body>…</body> Soҥn thҧo văn bҧn 9 Văn bɠn ÿɉͣc soɞn thɠo nhɉ bình thɉ͝ng trong các file HTML 9 Lɉu ý: –M͍i khoɠng tr͑ng, dɢu xu͑ng dòng trong HTML ÿɉͣc thʀ hiʄn trên trang web là 1 khoɠng tr͑ng duy nhɢt – Ĉʀ gõ m͙t s͑ ký tͱÿɴc biʄt ta phɠi sͭ dͥng mã: • Khoɠng tr͑ng (trong trɉ͝ng hͣp mu͑n có nhiɾu hɇn 1 ký tͱ tr͑ng): •Dɢu nh͏ hɇn (<) và l͛n hɇn (>): < > •Dɢu ngoɴc kép (“): " •Ký hiʄu : © • … 9 Ghi chú trong HTML: <! Ghi chú > Thҿ TAG trong HTML Có nhiɾu thɸ, m͗i thɸ có 1 tên và mang ý nghśa khác nhau 1. Phân loɞi : Có hai loɞi tag. - Tag ÿɇn : Là thɸ lʄnh không cɤn thɸ kɼt thúc Ví dͥ : Hello < br > < hr > - Tag cɴp : G͓m 1 m͙t cɴp thɸ m͟ và ÿóng theo cɢu trúc < tag > … < / tag > Tag kɼt thúc gi͑ng tag bɬt ÿɤu nhɉng có thêm dɢu (/) ͟ phía trɉ͛c. Ví dͥ : <p> Hello </p> Ví dͥ : <title> Trang chͧ </title> - Tag l͓ng : Các tag viɼt l͓ng nhau.Thɸ ÿɉͣc m͟ÿɤu tiên sɺ ÿɉͣc ÿóng sau cùng. Ví dͥ : <b> Phɤn <i> N͙i dung </i> </b> 2. Thu͙c tính (property) cͧa thɸ Nhiɾu tag còn có thu͙c tính kèm theo. M͙t thɸ có thʀ có các thu͙c tính nhɮm b͕ sung tác dͥng cho thɸ. Thu͙c tính cͧa Tag ÿɉͣc thʀ hiʄn trong phɞm vi thɸÿɤu cͧa tag. Cú pháp : <Tên Tag thu͙ctính1 thu͙ctính2 … > … < /Tag > Có thʀ dùng nhiɾu thu͙c tính trong m͙t tag, phân cách nhau b͟i khoɠng trɬng. Ví dͥ : < img src = “logo.gif” > < table border=“1” width=“100%” > < p align=“center”> Hello </p> <hr> <font face=“arial” size=“6”> Welcome ! </font> [...]... >) Chào b n Chào m ng b n n v i HTML! a2 M 3 < /html> ng C U TRÚC TRANG WEB Thành ph n Tiêu c a s trang Web Chào b n Chào m ng b n n v i HTML! < /HTML> N i dung th hi n Ý ngh a các thành ph n < /html> : nh ngh a ph m vi c a v n b n HTML. .. Ch s d G ch ngang n i dung i ( SubScript ) Ví d Vi du kieu chu Vi d ki u ch Ch in m Ch g ch chân Ch in nghiêng Ch g ch ngang Ch s trên X 2 Ch s d i H2O < /html> Tiêu Tiêu : v i kích th , o n v n, ng t dòng c... N i dung ghi chú trên Web Ví d Vi du Ky tu ac biet Ký t c bi t 50 > 42 4 < 25 i h c & Sài Gòn = " i h c Sài Gòn " < /html> nh d ng hình nh Cú pháp : < IMG SRC = Url ALT = text Border... Src = "3.jpg" Alt ="Tình yêu" border = 2 align = right > < /html> Âm thanh n n trang Web Cú pháp : < BGSOUND SRC = Url Loop = loop > Dùng chèn 1 t p tin âm thanh Midi làm nh c n n cho trang Web T p tin hình c xác nh b i thu c tính SRC Thu c tính : Url : ng d n t p tin âm thanh loop : s l n l p ( -1 l p vô h n ) Ví d Vi du Nhac nen trang web Dòng 1.c t 1 Dòng 1.c t 2 Dòng 2.c t 1 Dòng 2.c t 2 < /html> Ví d N i dung th hi n Ý ngh a các thành ph n < /html> : nh ngh a ph m vi c a v n b n HTML : Các mô t v trang HTML Các thông tin trong tag này không c hi n th trên web : Mô t tiêu trang web : Xác nh vùng thân c a trang web, n i ch a các thông tin ( D li u , hình nh …) nh d ng trang... thanh loop : s l n l p ( -1 l p vô h n ) Ví d Vi du Nhac nen trang web Âm thanh nh c n n cho trang Web < /html> Table – B ng bi u Cú pháp : < Table Border = x Bgcolor = color Width = w Height = h Cellpadding = m Cellspacing = n Align = alignStyle > … Khai báo dòng c t b ng Tag và Dùng nh... Border : ng vi n hình W: r ng nh H : cao nh alignStyle : V trí nh * Top, Bottom , Middle nh c xem nh 1 ký t * Left , Right nh tr ng thái Floating Sapce 1 , space 2 : Kh ang cách l tính v i nh Ví d Vi du chen hinh Hình 1 . Ngôn ngӳ HTML Phɞm Thɼ Bɠo Khoa Toán – Tin h͍c ptbao@hcmus.edu.vn http://www.math.hcmuns.edu.vn/~ptbao/TKW Giӟi thiӋu 9 HTML= HyperText Markup Language – Ngôn ngͯÿánh dɢu siêu văn bɠn – Ngôn. tiên 9 Trang HTML có phɤn m͟ r͙ng (ÿuôi) là .HTM hoɴc .HTML 9 Có thʀ tɞo trang HTML bɮng bɢt cͩ trình soɞn thɠo “văn bɠn thuɤn” nào (Notepad, EditPlus,…) 9 Có nhiɾu trình soɞn thɠo HTML cho phép. hay “chao .html < ;html& gt; <head> <title>Chào bңn</title> </head> <body> Chào mӭng bңn ÿӁn vӝi <U> ;HTML& lt;/U>! </body> < /html& gt; Trang