1 / 34

PHẦN 1: NGÔN NGỮ HTML (Hypertext Markup Language )

PHẦN 1: NGÔN NGỮ HTML (Hypertext Markup Language ). CHƯƠNG I GIỚI THIỆU VỀ WEB. I. CÁC KHÁI NIỆM CƠ BẢN. Internet : mạng máy tính toàn cầu , các máy truyền thông với nhau bằng giao thức chung là TCP/IP (Transfer Control Protocol/Internet Protocol)

niles
Download Presentation

PHẦN 1: NGÔN NGỮ HTML (Hypertext Markup Language )

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. PHẦN 1: NGÔN NGỮ HTML(Hypertext Markup Language) CHƯƠNG I GIỚI THIỆU VỀ WEB

  2. I.CÁC KHÁI NIỆM CƠ BẢN • Internet : mạngmáytínhtoàncầu, cácmáytruyềnthôngvớinhaubằnggiaothứcchunglà TCP/IP (Transfer Control Protocol/Internet Protocol) • Intranet : làmạngcụcbộkhôngnốivào Internet, truyềnthôngbằnggiaothức TCP/IP. • MôhìnhClient-Server: môhìnhkhách-chủ. Server chứatàinguyêndùngchungchonhiềumáy Client • InternetServer: làcác Server cungcấpcácdịchvụ Internet (Web Server, Mail Server, FTP Server…)

  3. I. CÁC KHÁI NIỆM CƠ BẢN • InternetServiceProvider (ISP):Nhàcungcấpdịchvụ Internet chokháchhàng. Mỗi ISP cónhiềukháchhàngvàcóthểcónhiềuloạidịchvụ Internet khácnhau. • InternetProtocol : tiêuchuẩn chi phốiviệcchuyểntảithông tin giữacácmáytínhtrongmạng • World Wide Web (WWW):dịchvụtracứuthông tin Internet. Dịchvụnàyđưaracáchtruyxuấtcáctàiliệucủacácmáyphụcvụdễdàngthông qua cácgiaotiếpđồhọa. Đểsửdụngdịchvụnàymáy Client cầncómộtchươngtrìnhgọilà Web Browser.

  4. I. CÁC KHÁI NIỆM CƠ BẢN • WebBrowser :trìnhduyệt Web. Dùngđểtruyxuấtcáctàiliệutrêncác Web Server. • Internet Explorer • Nestcape • Homepage:làtrang web đầutiêntrong web site • Hostingprovider: làcôngtyhoặctổchứcđưacáctrangcủachúngtalênmạng • Publish: Xuấtbảntrang web • Webserverlàmộtchươngtrìnhđápứngyêucầutruyxuấttàinguyên

  5. I. CÁC KHÁI NIỆM CƠ BẢN • URL(Unioform resource locator):mộtđịachỉchỉđếnmột file cụthểtrongnguồntàinguyênmạng. • Vídụ: 207.46.130.149 đượcbiểudiễntrong URL làwww.microsoft.com • URL tuyệtđối – làđịachỉ Internet đầyđủcủamộttranghoặc file, baogồmgiaothức, vịtrímạng, đườngdẫntuỳchọnvàtên file. Vídụ, http:// www.microsoft.com/ms.htm. • URL tươngđối - môtảngắngọnđịachỉtập tin kếtnốicócùngđườngdẫnvớitập tin hiệnhành, URL tươngđốiđơngiảnbaogồmtênvàphầnmởrộngcủatập tin.

  6. II. GIỚI THIỆU KHÁI QUÁT VỀ WEB • Weblàmộtứngdụngchạytrênmạng Client-Server, kháchvàchủ web liênlạcnhaubằnggiaothức http (HyperText Transfer Protocol). Các web server cungcấpthông tin đượcđịnhdạngtheongônngữ HTML • Web Page:làmột file vănbảnchứanhững tag HTML hoặcnhữngđọanmãđặcbiệtmàtrìnhduyệt web cóthểhiểuvàthôngdịchđược, file đượclưuvớiphầnmởrộnglà .html hoặchtm. • Website: Mộttậphợpnhiều web page, thểhiệnthông tin củamộttổchứchoặcmộtchủđềnàođó

  7. II. GIỚI THIỆU KHÁI QUÁT VỀ WEB • HTML(HyperTextmakup Language)gồmcácđoạnmãchuẩnđượcquyướcđểthiếtkế Web vàđượchiểnthịbởitrìnhduyệt Web • Hypertext (Hypertext link) làmộttừ hay mộtcụmtừđặcbiệtdùngđểtạoliênkếtgiữacáctrang web • Markup: làcáchđịnhdạngvănbảnđểtrìnhduyệthiểuvàthôngdịchđược. • Language:tậpnhữngquyluậtđểđịnhdạngvănbảntrêntrang web. • Trìnhsoạnthảotrangweb :Cóthểsoạnthảo web trênbấtkỳtrìnhsoạnthảovănbảnnào: Notepad, FrontPage hoặc Dreamweaver.

  8. III. TAG HTML • Cúpháp: <tagNameListProperties> Object </tagName> • TagName : tên tag HTML, liềnvớidấu “< “, khôngcókhoảngtrắng • Object :đốitượnghiểnthịtrêntrang Web • ListPropeties: danhsáchthuộctínhcủa Tag • Nếucónhiềuthuộctínhthìcácthuộctínhcáchnhaukhoảngtrắng <TagName property1=’value1’ property2=’value2’…> Object </TagName>

  9. IV. CẤU TRÚC CƠ BẢN CỦA TRANG WEB <HTML> <HEAD> Nội dung thông tin củatrang web </HEAD> <BODY> Nội dung hiểnthịtrêntrìnhduyệt </BODY> </HTML>

  10. V. CÁC TAG HTML CƠ BẢN <Title> : Hiểnthịnội dung tiêuđềcủatrang web trênthanhtiêuđềcủatrìnhduyệt Cúpháp: <TITLE> Nội dung tiêuđề </TITLE> <Hn>: Tạo header, gồm 6 cấp header, đượcđặttrongphần BODY Cúpháp <Hn ALIGN= “Direction”> Nội dung của Header </Hn>

  11. V. CÁC TAG HTML CƠ BẢN <P> : Dùngđểngắtđoạnvàbắtđầuđoạnmới Cúpháp: <P ALIGN = “Direction”> Nộidung củađoạn </P> <BR>: Ngắtdòngtạivịtrícủacủa tag. <HR>: Kẻđườngngangtrang Cúpháp: <HR Align=”directtion” Width= “Value” Size=value color=#rrggbb>

  12. V. CÁC TAG HTML CƠ BẢN <FONT>: địnhdạng font chữchocảtàiliệuthìđặt tag <Font> trongphần <Body> Cúpháp: <FONT Face=”fontName1, fontName2, fontName3” size=”value” Color=”rrggbb”> Nội dung hiển thị </FONT>

  13. V. CÁC TAG HTML CƠ BẢN <BODY > : Chứa nội dung của trang web Cúpháp: <BODY> Nội dung chính của trang web </BODY> Cácthuộctínhcủa <Body> • BgColor: thiếtlậpmàunềncủatrang • Text: thiếtlậpmàuchữ • Link: màucủasiêuliênkết • Vlink: màucủasiêuliênkếtđãxem qua • Background: load mộthìnhlàmnềnchotrang • LeftMargin, TopMargin: Canhlềtrái/lềtrêncủatrang

  14. V. CÁC TAG HTML CƠ BẢN Vídụ: <HTML> <HEAD> <TITLE> LearningHTML</TITLE> </HEAD> <BODY BGCOLOR=”#0000FF” text=”yellow”> <FONT COLOR = LIMEGRREN> Welcome to HTML </FONT> </BODY> </HTML>

  15. V. CÁC TAG HTML CƠ BẢN <IMG> : Chènhìnhảnhvàotrang Web Cúpháp: <Imgsrc=”URL of Image” alt=”Text” width=value height=value border=value> <BgSound> : ChènâmthanhvàotrangWeb. Âmthanhnàysẽđượcphátmỗikhingườisửdụngmởtrang Web. Cúpháp: <BgSoundsrc=”filenhac” Loop=value>

  16. V. CÁC TAG HTML CƠ BẢN • <EMBED>:Đưaâmthanhtừ video clip vàotrang Cúpháp: <EMBED SRC="URL" width=value height=value > Vídụ: <embed src=“nhac.wmv" width="80%“ height="50%" autostart="true“ loop="true" hidden="false“></embed>

  17. V. CÁC TAG HTML CƠ BẢN <Marquee></Marquee> : Điềukhiểnđốitượngchạymộtcáchtựđộngtrêntrang Web Cúpháp: <Marquee >Object</Marquee> <!-- Ghichú-->:Chúthíchkhônghiểnthị. Cúpháp: <! -- Nội dung lờichúthích --> <B>: địnhdạngchữđậm Cúpháp <B> Nội dung chữđậm</B>

  18. V. CÁC TAG HTML CƠ BẢN <I>: Địnhdạngchữnghiêng Cúpháp: <I> Nội dung chữnghiêng</I> <U>: Gạchchânvănbản Cúpháp: <U> Nội dung chữgạchchân</U> <BIG> và <SMALL>: Chỉnhcởchữ to hoặcnhỏhơncởchữxungquanh Cúpháp <BIG> Nội dung chữ to </BIG> <SMALL> Nội dung chữnhỏ </SMALL>

  19. V. CÁC TAG HTML CƠ BẢN <SUP> và <SUB> :Đưachữlêncaohoặcxuốngthấp so vớivănbảnbìnhthường Cúpháp: <SUP> Nội dung chữdưalêncao </SUP> <SUB> Nội dung chữđưaxuốngthấp </SUB> <STRIKE>: Gạchngangvănbản Cúpháp: <STRIKE> Nội dung văn bản bị gạch ngang </STRIKE>

  20. V. CÁC TAG HTML CƠ BẢN <CODE>…</CODE>: Dùngđểnhậpmộtdòngmãcóđịnhdạngkýtựriêng. Dòngmãnàykhôngđượcthựchiệnmàđượchiểnthịdướidạngvănbảnbìnhthường Cúpháp: <CODE> Nội dung vănbảnmuốnđịnhdạng </CODE> Vídụ: <CODE> If A &lt; B Then <BR> A = A + 1 </CODE>

  21. V. CÁC TAG HTML CƠ BẢN <EM>: Vănbảnđượcnhấnmạnh (giống tag <I>) Cúpháp: <EM>Vănbảnđượcnhấnmạnh</EM> <STRONG>: Địnhdạngchữđậm (giống <B>) Cúpháp: <STRONG>Vănbảnđượcnhấnmạnh</STRONG> <BLOCKQUOTE>: tươngđươngvớiphím tab Dùngphâncáchmộtkhốivănbảnđểnhấnmạnh, đoạnvănbảnnàyđượctáchthànhmột paragraph riêng, thêmkhoảngtrắngtrênvàdướiđoạnđồngthờithụtvào so vớilềtrái (tươngđươngchứcnăngcủaphím tab)

  22. V. CÁC TAG HTML CƠ BẢN Cúpháp: <BLOCKQUOTE> Nội dung khốivănbảnnhấnmạnh </BLOCKQUOTE> <PRE>: Giữnguyêncácđịnhdạngnhư: ngắtdòng, khoảngcách, thíchhợpvớiviệctạobảng Cúpháp: <PRE> Nội dung vănbảncầnđịnhdạngtrứơcvớitấtcảđịnhdạngkhoảngcách, xuốngdòngvàngắthàng </PRE>

  23. V. CÁC TAG HTML CƠ BẢN Vídụ: <HTML> <HEAD><TITLE>Learning HTML</TITLE><HEAD> <BODY> <PRE> TrườngĐạiHọcCôngNghiệp TP.HCM KhoaCôngNghệThông Tin </PRE> </BODY> </HTML>

  24. V. CÁC TAG HTML CƠ BẢN <DIV> chiavănbảnthànhmộtkhốibắtđầutừmộtdòngmới. <SPAN> táchkhốinhưngkhôngbắtđầutừmộtdòngmới Cúpháp: <DIV> Nội dung củakhốibắtđầutừmộtdòngmới </DIV>

  25. V. CÁC TAG HTML CƠ BẢN Vídụ: <HTML> <HEAD><TITLE> Learning HTML</TITLE></HEAD> <BODY> <DIV align = center> <FONT size = 4 color = hotpink face = Arial> TrườngĐạiHọcCôngNghiệp TP.HCM<br> </FONT> KhoaCôngNghệThông Tin </DIV> </BODY> </HTML>

  26. V. CÁC TAG HTML CƠ BẢN <SPAN> Nội dung củakhốitrong 1 dòng </SPAN> Vídụ: <HTML> <HEAD><TITLE> Learning HTML</TITLE></HEAD> <BODY> <SPAN STYLE = “FONT-SIZE:25; Color:BLUE”> Creating Web Pages </SPAN><font size=6 color=red >With HTML</font> </BODY> </HTML>

  27. VI. CÁC KÝ TỰ ĐẶC BIỆT Lớnhơn (>): &gt; Vídụ: If A &gt; B Then <BR> A = A + 1 </CODE> Nhỏhơn (<): &lt; Vídụ: If A &lt; B Then <BR> A = A + 1

  28. VI. CÁC KÝ TỰ ĐẶC BIỆT Cặpnháy””: &quot; Vídụ: <BODY> &quot; To be or not to be? &quot; That is the question </BODY> Kýtựvà &: &amp; Vídụ: <P> William &amp; Graham went to the fair Kýtựkhoảngtrắng: &nbsp;

  29. VII. CÁC THAO TÁC TRONG CỬA SỔ TRÌNH DUYỆT • Load lạitrang Web: Click biểutượng Refresh (F5) • Chỉnh size chữcủatrang: View->Text size • Chỉnhlại font chữ: Chọn Menu View->EnCoding • Nếutrang Web khônghiểnthịđược Font tiếngViệt: • Chọn menu Tool chọn Internet Options->Chọn Tab Fontschọn Font tiếngViệt • Hoặcchọn Menu View>EnCodingchọncác font như User defined,Vietnamese….

  30. VII. CÁC THAO TÁC TRONG CỬA SỔ TRÌNH DUYỆT • Tab General:thiếtlậpcáctùychọnchotrìnhduyệt • Use Current: chọntranghiệntạiđể load lênmỗilầnkhởiđộng IE • Use Default: địachỉtrang Web mặcđịnh • History:lưulạicáctrang web đãduyệt qua tạimáy Client vàthông tin đăngnhậpcủa user hiệnhành…Nếukhộngmuốnlưulại: Chọn Delete Cookies và Delete Files. • Days to keep pages in history: thiếtlậpkhoảngthờigianlưutrữtrangtrongđốitượng History

  31. VII. CÁC THAO TÁC TRONG CỬA SỔ TRÌNH DUYỆT • Tab Advance: cóthểchọncáctùychọnkhácnhư: • Ngănchặnkhôngchotảihìnhxuốngtrang web • Màuliênkết, cáchthểhiệnliênkếttrêntrang • Hiệuchỉnhtrang Web: • View source->hiệuchỉnhchọn File  Save đểlưulại F5 đểcậpnhậtlạinội dung vừahiệuchỉnh

More Related