intTypePromotion=1
zunia.vn Tuyển sinh 2024 dành cho Gen-Z zunia.vn zunia.vn
ADSENSE
 » 
 » 

Giáo trình học thiết kế web - Trường Đại học Công nghiệp

Chia sẻ: Võ Đức Danh | Ngày: | Loại File: PDF | Số trang:171

Thêm vào BST
Báo xấu
411
lượt xem 179
download
 
  Download Vui lòng tải xuống để xem tài liệu đầy đủ

Thiết kế web là hoạt động trải rộng từ khâu thu thập ý tưởng, yêu cầu của khách hàng tới việc dựng đề án, bản thảo, tiến hành thiết kế giao diện đồ hoạ, tổ chức thực hiện thiết lập, ...

Chủ đề:

Bình luận(0) Đăng nhập để gửi bình luận!

Lưu

Nội dung Text: Giáo trình học thiết kế web - Trường Đại học Công nghiệp

  1. 2-2009 GIÁO TRÌNH THI T K W EB Lưu Hành N i B
  2. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) CHƯƠNG I: GI I THI U V WEB I.1. CÁC KHÁI NI M CƠ B N: – Internet là m t m ng máy tính toàn c u trong ñó các máy truy n thông v i nhau theo m t ngôn ng chung là TCP/IP. – Intranet ñó là m ng c c b không n i vào Internet và cách truy n thông c a chúng cũng theo ngôn ng chung là TCP/IP. – Mô hình Client-Server: là mô hình khách-ch . Server ch a tài nguyên dùng chung cho nhi u máy khách(Client) như các t p tin, tài li u, máy in… Ưu ñi m c a mô hình này là ti t ki m v th i gian, tài chính, d qu n tr h th ng…Cách ho t ñ ng c a mô hình này là máy Server trang thái ho t ñ ng(24/24) và ch yêu c u t phía Client. Khi Client yêu c u thì máy Server ñáp ng yêu c u ñó. – Internet Server là các Server cung c p các d ch v Internet(Web Server, Mail Server, FTP Server…) – Internet Service Provider(ISP): Là nơi cung c p các d ch v Internet cho khách hàng. M i ISP có nhi u khách hàng và có th có nhi u lo i d ch v Internet khác nhau. – Internet Protocol : Các máy s d ng trong m ng Internet liên l c v i nhau theo m t tiêu chu n truy n thông g i là Internet Protocol (IP). IP Address-ñ a ch IP: ñ vi c trao ñ i thông tin trong m ng Internet th c hi n ñư c thì m i máy trong m ng c n ph i ñ nh danh ñ phân bi t v i các máy khác. M i máy tính trong m ng ñư c ñ nh danh b ng m t nhóm các s ñư c g i là ñ a ch IP. ð a ch IP g m 4 s th p phân có giá t 0 ñ n 255 và ñư c phân cách nhau b i d u ch m. Ví d 192.168.0.1 ð a ch IP này có giá tr trong toàn m ng Internet. U ban phân ph i ñ a ch IP c a th gi i s phân chia các nhóm ñ a ch IP cho các qu c gia khác nhau. Thông thư ng ñ a ch IP c a m t qu c gia do các cơ quan bưu ñi n qu n lý và phân ph i l i cho các ISP. M t máy tính khi thâm nh p vào m ng Internet c n có m t ñ a ch IP. ð a ch IP có th c p t p th i ho c c p vĩnh vi n. Thông thư ng các máy Client k t n i vào m ng Internet thông qua m t ISP b ng ñư ng ñi n tho i. Khi k t n i, ISP s c p t m th i m t IP cho máy Client. – Phương th c truy n thông tin trong Internet: Khi m t máy tính có ñ a ch IP là x(máy X) g i tin ñ n máy tính có ñ a ch IP là y (máy Y) thì phương th c truy n tin cơ b n di n ra như sau: N u máy X và máy Y cùng n m trên m t m ng con thì thông tin s ñư c g i ñi tr c ti p. Còn máy X và Y không cùng n m trong m ng con thì thông tin s ñư c chuy n t i m t máy trung gian có ñư ng thông v i các m ng khác r i m i chuy n t i máy Y. Máy trung gian này g i là Gateway. – World Wide Web(WWW): là m t d ch v ph bi n nh t hi n nay trên Internet. D ch v này ñưa ra cách truy xu t các tài li u c a các máy ph c v d dàng thông qua các giao ti p ñ h a. ð s d ng d ch v này máy Client c n có m t chương trình g i là Web Browser. – Web Browser(trình duy t): là trình duy t Web. Dùng ñ truy xu t các tài li u trên các Web Server. Các trình duy t hi n nay là Internet Explorer, Nestcape – Home page: là trang web ñ u tiên trong web site – Hosting provider: là công ty ho c t ch c ñưa các trang c a chúng ta lên web – Hyperlink : tên khác c a hypertextlink – Publish: làm cho trang web ch y ñư c trên m ng – URL(Unioform resource locator): m t ñ a ch ch ñ n m t file c th trong ngu n tài nguyên m ng. Trang 1
  3. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) M i ngu n trên web có duy nh t m t ñ a ch r t khó nh . Vì v y, ngư i ta s d ng URL là m t chu i cung c p ñ a ch Internet c a m t web site ho c ngu n trên World Wide Web. ð nh d ng ñ c trưng là: www.nameofsite.typeofsite.countrycode Ví d : 207.46.130.149 ñư c bi u di n trong URL là www.microsoft.com URL cũng nh n bi t giao th c c a site ho c ngu n ñư c truy c p. Giao th c thông thư ng nh t là “http”, m t vài d ng URL khác là “gopher”, cung c p ñ a ch Internet c a m t thư m c Gopher, và “ftp”, cung c p v trí m ng c a ngu n FTP. Có hai d ng URL: URL tuy t ñ i – là ñ a ch Internet ñ y ñ c a m t trang ho c file, bao g m giao th c, v trí m ng, ñư ng d n tuỳ ch n và tên file. Ví d , http:// www.microsoft.com/ms.htm. URL tương ñ i - mô t ng n g n ñ a ch t p tin k t n i có cùng ñư ng d n v i t p tin hi n hành, URL tương ñ i ñơn gi n bao g m tên và ph n m r ng c a t p tin. Ví d : index.html – Web server là m t chương trình ñáp ng l i các yêu c u truy xu t tài nguyên t trình duy t. I.2. GI I THI U KHÁI QUÁT V WEB – Web là m t ng d ng ch y trên m ng(Client-Server), ñư c chia s kh p toàn c u. – Trang web là m t file văn b n ch a nh ng tag HTML ho c nh ng ñ an mã ñ c bi t mà trình duy t web (Web browser) có th hi u và thông d ch ñư c, file ñư c lưu v i ph n m r ng là .html ho c htm. – HTML (HyperText Markup Language), g m các ño n mã chu n ñư c quy ư c ñ thi t k Web và ñư c hi n th b i trình duy t Web (Web Browser) Hypertext (Hypertext link), là m t t hay m t c m t ñ c bi t dùng ñ t o liên k t gi a các trang web Markup: là cách ñ nh d ng văn b n ñ trình duy t hi u và thông d ch ñư c. Language: ñây không là ngôn ng l p trình, mà ch là t p nh nh ng quy lu t ñ ñ nh d ng văn b n trên trang web. – Trình so n th o trang web :Có th so n th o web trên b t kỳ trình so n th o văn b n nào. Các trình so n th o ph bi n hi n nay là: Notepad, FrontPage ho c Dreamweaver. I.3. TAG HTML: Tag HTML là nh ng câu l nh n m gi a c p tag “”, dùng ñ ñ nh d ng các văn b n trên trang web. D ng chung c a m t tag HTML là: Object Trong ñó: – TagName : là tên m t tag HTML, vi t li n v i d u “< “, không có kho ng tr ng – Object : là ñ i tư ng c n ñ nh d ng trong trang Web – ListPropeties là danh sách thu c tính c a Tag, là nh ng ñ c ñi m b sung vào cho m t tag, th t các thu c tính trong m t tag là tuỳ ý. N u có t 2 thu c tính tr lên thì m i thu c tính cách nhau b i kho ng tr ng. Object – Giá tr c a thu c tính ñư c ñ t trong nháy ñơn ‘ ho c nháy ñôi “.(có th b qua) Trang 2
  4. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) – : g i là tag m – : g i là tag ñóng. Thông thư ng thì các tag ñ u có tag ñóng. Tuy nhiên có m t s tag không có tag ñóng Ví d : n i dung TagName(m ) Properties TagName(ñóng) – Có th có nhi u tag l ng vào nhau, theo nguyên t c tag nào m trư c thì tag ñó ñóng sau Ví d : Object Object1Object2 – Trong trang HTML, n u m t tag b sai thì n i dung bên trong Tag ñó không hi n th trên trình duy t I.4. C U TRÚC CƠ B N C A TRANG WEB: 1. C u trúc trang web – Ph n ñ u(): là ph n ch a thông tin c a trang Web. – Ph n thân (): là ph n ch a n i dung c a trang Web. – Ph n ñ u và ph n thân ñư c ñ t trong c p tag N i dung thông tin c a trang web N i dung hi n th trên trình duy t 2. Hi n th trang web: – Kh i ñ ng trình duy t Internet Explorer – Ch n menu file,open, dùng browse tìm t p tin html m i t o – Ho c double click vào tên t p tin .htm I.5. CÁC TAG HTML CƠ B N : I.5.1. : Hi n th n i dung tiêu ñ c a trang web trên thanh tiêu ñ c a trình duy t. – C p tag ñư c ñ t trong ph n c a trang HTML – Cú pháp: N i dung tiêu ñ I.5.2. : T o header, g m 6 c p header, ñư c ñ t trong ph n BODY – Cú pháp: N i dung c a Header Trong ñó: – Direction: g m các giá tr left, right, center, dùng ñ canh l cho header, m c ñ nh là canh trái Trang 3
  5. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) – Ví d : Heading 1 Heading 2 Heading 3 Heading 4 Heading 5 Heading 6 I.5.3. : – Dùng ñ ng t ño n và b t ñ u ño n m i – Cú pháp: N i dung c a ño n – Tag không b t bu c. – Tag k ti p s t ñ ng b t ñ u m t ño n m i. I.5.4. : – Ng t dòng t i v trí c a c a tag. Ví d : Mary had a little lamb It’s fleece was white as snow Everywhere that Mary went She was followed by a little lamb I.5.5. : – Dùng ñ k ñư ng ngang trang, không có tag ñóng – Cú pháp: Trong ñó: Direction: g m các giá tr left, right, center Width: ñ dài ñư ng k , tính b ng Pixel ho c % Size: ñ dày c a ñư ng k , tính b ng pixel Color: màu ñư ng k , có th dùng tên màu ho c dùng mã #rrggbb Ví d : Welcome to HTML My first HTML document This is going to be real fun Trang 4
  6. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) I.5.6. : – Dùng ñ nh d ng font ch – ð nh d ng Font ch cho c tài li u thì ñ t tag trong ph n – ð nh d ng t ng ph n ho c t ng t thì ñ t t i v trí mu n ñ nh d ng – Cú pháp: N i dung hi n th Ví d : Welcome to HTML My first HTML document This is going to be real fun I.5.7. : – Ch a n i dung c a trang web – Cú pháp: N i dung chính c a trang web – Các thu c tính c a BgColor: thi t l p màu n n c a trang Text: thi t l p màu ch Link: màu c a siêu liên k t Vlink: màu c a siêu liên k t ñã xem qua Background: dùng load m t hình làm n n cho trang LeftMargin: Canh l trái TopMargin: Canh l trên c a trang Ví d : Learning HTML Welcome to HTML Màu s c: Internet Explorer có th xác l p 16 màu theo tên như sau: – Black, Silver, Gray, White, Maroon, Red, Purple, Fuchsia, Green, Lime, Olive, Yellow, Navy, Blue, Teal, Aqua. – M t s mã th p l c phân c a màu :#RRGGBB Trang 5
  7. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) Mã th p l c phân Màu #FF0000 RED #00FF00 GREEN #0000FF BLUE #000000 BLACK #FFFFFF WHITE I.5.8. : – Dùng ñ chèn m t hình nh vào trang Web – Cú pháp: o Src: xác ñ nh ñư ng d n t p tin c n load, s d ng ñư ng d n tương ñ i . o Alt: ch a n i dung văn b n thay th cho hình nh khi hình không load v ñư c, n u load v ñư c thì s xu t hi n n i dung trong textbox m i khi ngư i dùng ñưa chu t t i hình. o Width, Height: dùng ñ xác ñ nh ch ñ phóng to thu nh hình nh. o Align =” left/ right/top/bottom”: so hàng gi a hình nh và text I.5.9. : – Dùng ñ chèn m t âm thanh vào trangWeb. Âm thanh này s ñư c phát m i khi ngư i s d ng m trang Web. – Cú pháp: o Src ch a ñ a ch file nh c, file này có ph n m r ng .mp3 , mdi, … o Loop xác ñ nh ch ñ l p ñi l p l i c a bài hát, n u value< 0 thì l p vô h n, value=n thì l p l i n l n r i t ñ ng t t. I.5.10. : – Cho phép ñưa âm thanh tr c ti p vào trang WEB. – Cú pháp: Ví d : I.5.11. : – Dùng ñ ñi u khi n ñ i tư ng ch y m t cách t ñ ng trên trang Web – Cú pháp: Object – Các thu c tính c a Marquee : o Direction =up/ down / left / right dùng ñ ñi u khi n hư ng ch y. o Behavior=alternate: ñ i tư ng ch y t l này sang l kia và ngư c l i. Ví d : ð i tư ng ch y lên I.5.12. : N i dung trong c p tag này không hi n th trong trang Trang 6
  8. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) Cú pháp: I.5.13. : ñ nh d ng ch ñ m – Cú pháp N i dung ch ñ m Ví d : This is good fun I.5.14. Tag : ð nh d ng ch nghiêng – Cú pháp: N i dung ch nghiêng I.5.15. Tag : G ch chân văn b n – Cú pháp: N i dung ch g ch chân Ví d : ð nh d ng kh i văn b n v a ñ m, nghiêng và g ch chân Trư ng ðHCN TP HCM I.5.16. Tag và : – Ch nh c ch to ho c nh hơn c ch xung quanh – Cú pháp N i dung ch to N i dung ch nh I.5.17. Tag và : – ðưa ch lên cao ho c xu ng th p so v i văn b n bình thư ng – Cú pháp: N i dung ch dưa lên cao N i dung ch ñưa xu ng th p Ví d : a2 H2O I.5.18. : – G ch ngang văn b n – Cú pháp: N i dung văn b n b g ch ngang I.5.19. …: – Dùng ñ nh p m t dòng mã có ñ nh d ng ký t riêng. Dòng mã này không ñư c th c hi n mà ñư c hi n th dư i d ng văn b n bình thư ng – Cú pháp: N i dung văn b n mu n ñ nh d ng Trang 7
  9. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) Ví d : If (x > 0) x = x + 1 else y=y+1 I.5.20. : Văn b n ñư c nh n m nh (gi ng tag ) – Cú pháp: Văn b n ñư c nh n m nh I.5.21. : ð nh d ng ch ñ m (gi ng ) – Cú pháp: Văn b n ñư c nh n m nh I.5.22. : – Dùng phân cách m t kh i văn b n ñ nh n m nh, ño n văn b n này ñư c tách ra thành m t paragraph riêng, thêm kho ng tr ng trên và dư i ño n ñ ng th i th t vào so v i l trái (tương ñương ch c năng c a phím tab) – Cú pháp: N i dung kh i văn b n nh n m nh Ví d : Learning HTML Humpty Dumpty sat on a wall Humpty Dumpty had a great fall All the King’s horses And all the King’s men Could not put Humpty Dumty together again I.5.23. : – Gi nguyên các ñ nh d ng như: ng t dòng, kho ng cách, thích h p v i vi c t o b ng – Cú pháp: N i dung văn b n c n ñ nh d ng tr ơc v i t t c ñ nh d ng kho ng cách, xu ng dòng và ng t hàng Trang 8
  10. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) Ví d : Learning HTML Humpty Dumpty sat on a wall Humpty Dumpty had a great fall All the King’s horses And all the King’s men Could not put Humpty Dumty together again I.5.24. : – Chia văn b n thành các kh i, có chung m t ñ nh d ng chia văn b n thành m t kh i b t ñ u t m t dòng m i. tách kh i nhưng không b t ñ u t m t dòng m i – Cú pháp: N i dung c a kh i b t ñ u t m t dòng m i N i dung c a kh i trong 1 dòng Ví d : Learning HTML Division 1 The DIV element is used to group elements. Typically, DIV is used for block level elements Division 2 This is a second division Are you having fun? The second division is right aligned. Common formatting is applied to all the elements in the division Trang 9
  11. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) I.5.25. Các ký t ñ c bi t: a. L n hơn (>): &gt; Ví d : If A &gt; B Then A=A+1 b. Nh hơn (Text size – Ch nh l i font ch : Ch n Menu View->EnCoding – Trong trư ng h p trang Web không hi n th ñư c Font ti ng Vi t: – Ch n menu Tool ch n Internet Options->Ch n Tab Fonts ch n Font ti ng Vi t – N u ch n r i mà không hi n th ñư c font ti ng Vi t thì ch n Menu – View >EnCoding ch n các font như User defined,Vietnamese…. – Các tuỳ ch n khác cho trang Web: Tools Internet option: Không Load hình xu ng, ñ nh d ng liên k t,… – Ch n trang web m c ñ nh khi m trình duy t Trang 10
  12. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) Hình 1 Hình 2 Trang 11
  13. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) – Tab General(Hình 1): thi t l p các tùy ch n cho trình duy t – Click nút Use Current: ch n trang hi n t i ñ load lên m i l n kh i ñ ng IE – Use Default: ñ a ch trang Web m c ñ nh m i khi m trình duy t Ví d m i khi m IE thì t ñ ng hi n th trang Web Yahoo trong ô Address nh p: http://yahoo.com , n u ch n Use Blank thì hi n th trang tr ng . – History: lưu l i các trang web ñã duy t qua t i máy Client và thông tin ñăng nh p c a user hi n hành… – N u kh ng mu n lưu l i: Ch n Delete Cookies và Delete Files. – Có th thi t l p kho ng th i gian lưu tr trang trong ñ i tư ng History b ng cách thay ñ i giá tr trong ô “Days to keep pages in history” . – N u mu n xoá ñ i tư ng này thì nh n Clear history. – Tab Advance(Hình 2): có th ch n các tùy ch n khác như: – Ngăn ch n không cho t i hình xu ng trang web – Màu liên k t, cách th hi n liên k t trên trang – Copy hình nh t trang Web: Click ph i vào hình nh c n sao chép r i ch n Save picture as, ho c Save background as,… – Load v trang Web bao g m các hi u ng, script, hình nh… ch a trên trang: Ch n Menu File Save As Ch n v trí lưu file Save. – Hi u ch nh trang Web: View source->hi u ch nh ch n File Save ñ lưu l i F5 ñ c p nh t l i n i dung v a hi u ch nh Trang 12
  14. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) CHƯƠNG II: SIÊU LIÊN K T-HÌNH NH II.1. GI I THI U SIÊU LIÊN K T II.1.1. Siêu liên k t: Kh năng chính c a HTML là h tr các siêu liên k t. M t siêu liên k t cho phép ngư i truy c p có th ñi t trang web này ñ n trang web khác. M t liên k t g m 3 ph n: – Ngu n: ch a n i dung hi n th khi ngư i dùng truy c p ñ n, có th là m t trang web khác, m t ño n film, m t hình nh ho c m t h p tho i ñ g i mail… – Nhãn: có th là dòng văn b n ho c hình nh ñ ngư i dùng click vào khi mu n truy c p ñ n liên k t, n u nhãn là văn b n thì thư ng ñư c g ch dư i – ðích ñ n (target): xác ñ nh v trí ñ ngu n hi n th . II.1.2. Các lo i liên k t – Internal Hyperlink:(Liên k t trong) là các liên k t v i các ph n trong cùng m t tài li u ho c liên k t các trang trong cùng m t web site. – External Hyperlink (Liên k t ngoài) là các liên k t v i các trang trên web site khác. II.2. T O SIÊU LIÊN K T Cú pháp: Nhãn – Dùng URL tương ñ i ñ liên k t ñ n các trang trong cùng m t website Ví d : Using links Click here to view document 2 – Dùng URL tuy t ñ i ñ liên k t ñ n các trang trong website khác Ví d : liên k t ñ n Google II.2.1. Liên k t v i các ph n trong cùng m t trang web – N u n i dung c a trang quá dài thì nên t o các Bookmark ñ nh y ñ n m t ph n c th nào ñó trên chính trang web hi n hành. – Cách t o liên k t ñ n các ph n trong cùng trang: g m 2 bư c Trang 13
  15. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) T o BookMark: Nhãn N i dung T o liên k t ñ n Bookmark: Nhãn c a text liên k t Ví d : Using htm links Internet Introduction to HTML Internet Internet là m t m ng c a các m ng. Nghĩa là, các m ng máy tính ñư c liên k t v i các m ng khác, n i các nư c và ngày nay là toàn c u. Giao th c truy n thông là TCP/IP cung c p liên k t v i t t c các máy tính trên th gi i Introduction to HTML Ngôn ng ñánh d u siêu văn b n là ngôn ng chu n mà web s d ng ñ t o và nh n ra tài li u. M c dù không ph i là m t t p con c a ngôn ng nâng c p tiêu chu n t ng quát (SGML), ngôn ng ñánh d u siêu văn b n cũng có liên quan v i SGML. SGML là m t phương pháp trình bày các ngôn ng ñ nh d ng tài li u. HTML là ngôn ng ñánh d u ñư c s d ng ñ t o tài li u HTML. Các hư ng d n ch rõ m t trang web nên ñư c hi n th như th nào trong trình duy t K t qu trên trình duy t Trang 14
  16. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) II.2.2. Liên k t v i m t Bookmark m t tài li u khác Cú pháp: Ví d : – Trang main.htm Main document Internet Introduction to HTML – Trang Doc1.htm Using Links Internet Internet là m t m ng c a các m ng. Nghĩa là, m ng máy tính ñư c liên k t v i các m ng khác, n i v i các nư c và ngày nay là toàn c u. Giao th c truy n TCP/IP cung c p liên k t v i t t c các máy tính trên th gi i. Introduction to HTML Ngôn ng ñánh d u siêu văn b n là ngôn ng chu n mà web s d ng ñ t o và nh n ra tài li u. M c dù không ph i là m t t p con c a ngôn ng nâng c p tiêu chu n t ng quát (SGML), ngôn ng ñánh d u siêu văn b n cũng có liên quan v i SGML. SGML là m t phương pháp trình bày các ngôn ng ñ nh d ng tài li u. HTML là ngôn ng ñánh d u ñư c s d ng ñ t o tài li u HTML. II.2.3. Liên k t ñ n h p thư e-mail Cú pháp: Nhãn – N u siêu liên k t ñ t cu i trang thì dùng tag Cú pháp: Nhãn II.3. HÌNH NH TRÊN TRANG WEB: II.3.1. Các lo i nh : a) nh .Gif (Graphics Interchange Format): ñư c s d ng ph bi n nh t trong các tài li u HTML, d chuy n t i, ngay c các k t n i s d ng MODEM t c ñ ch m, h tr 256 màu GIF. Các file GIF ñư c ñ nh d ng không ph thu c ph n n n b) nh JPEG (Joint PhotoGraphic Expert Group) có ph n m r ng .JPG, là lo i nh nén m t thông tin, nghĩa là nh sau khi b nén không gi ng như nh g c. Tuy nhiên, trong quá trình phát l i thì nh cũng t t g n như nh g c. JPEG h tr hơn 16 tri u màu và thư ng ñư c s d ng cho các nh có màu th c. Trang 15
  17. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) c) nh PNG (Portable Network Graphics) nén không m t d li u II.3.2. Chèn hình nh Cú pháp: URL: ñ a ch c a t p tin hình nh, thư ng s d ng ñ a ch tương ñ i, ví d : không ph thu c v trí c a t p tin nh trên ñĩa n: ñ dày c a ñư ng vi n, tính b ng pixel Alt: N i dung thay th s hi n th khi hình không load ñư c, ho c khi ñưa chu t ngang qua hình II.3.3. Các thu c tính c a nh: a) Dàn văn b n quanh hình nh: N i dung văn b n quanh hình nh N i dung văn b n quanh hình nh Ví d : b) Kích thư c nh: Ví d : Image c) Ch n văn b n bao quanh hình: Canh l khi dàn văn b n xung quanh m t nh s tác ñ ng ñ n t t c các văn b n sau ñó n u không chèn vào m t dòng k ñ c bi t. Thu c tính CLEAR trong tag BR làm cho văn b n không b t ñ u n u l c th không b xóa ñi (nghĩa là t i c nh dư i c a nh) Cú pháp: : Ngăn ch n văn b n dàn bên l ph i c a nh : Ngăn ch n văn b n dàn bên l trái c a nh : Ngăn ch n văn b n dàn hai bên l c a nh Trang 16
  18. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) d) Thêm kho ng tr ng xung quanh nh N u không mu n văn b n dàn xung quanh l trái c a nh thì ta có th thêm kho ng tr ng xung quanh nh Cú pháp: HSPACE=n: Kho ng tr ng ñư c tính b ng pixel s thêm vào c bên ph i và bên trái c a nh VSPACE=m: Kho ng tr ng ñư c tính b ng pixel s thêm vào c bên trên và bên dư i c a nh e) Canh l cho nh: Có th canh l cho nh so v i m t dòng văn b n trong m t ñ an Cú pháp: Văn b n mu n canh l so v i nh Direction: g m các giá tr : top, bottom, middle, texttop Ví d : II.3.4. Dùng nh làm liên k t: Có th dùng hình nh ñ t o m t liên k t ñ n m t trang khác, ho c n u có m t nh l n, b n có th t o nh nh hơn ho c m t bi u tư ng cho nó ñ nó có th hi n th nhanh chóng trên trang web, sau ñó t o liên k t ñ ñưa ngư i truy c p ñ n nh có kích thư c th t Cú pháp: Nhãn II.3.5. B nñ nh: B n ñ nh là m t nh trong trang web ñư c chia ra làm nhi u vùng, m i vùng khi click vào s liên k t ñ n m t ñ a ch URL Cách t o:Trư c h t ph i chèn vào trang m t nh và ñ t nhãn cho nh Trang 17
  19. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) Trong ñó: - Label: tên c a b n ñ nh - Type: hình d ng c a các vùng trên nh, g m các lo i: • Rect: Vùng hình ch nh t • Circle: Vùng hình tròn • Poly: Vùng hình ña giác - Coords:to ñ các ñ nhc a hình • Rect: (x1, y1, x2, y2) là to ñ 2 ñ nh chéo c a vùng hình CN • Circle: (x, y, r) l n lư t là to ñ tâm và bán kính c a vùng hình tròn • Poly: (x1, y1, x2, y2, x3, y3, …) là các ñ nh c a vùng hình ña giác y y x Ví d : x Image II.3.6. Hình n n : Trong h u h t các trang web thư ng s d ng n n màu, v i m c ñích là làm n i b t n i dung trang ñó. Tuy nhiên cũng có th s d ng hình nh ñ làm n n b ng thu c tính BACKGROUND c a th BODY. Trang 18
  20. Giáo Trình Thi t K Web Trung Tâm CNTT (H.U.I) CHƯƠNG III: DANH SÁCH III.1. DANH SÁCH KHÔNG CÓ TH T (Unorder List -UL) Cú pháp: N i dung 1 N i dung 2 … − Shape 1, Shape 2 là lo i bullet t ñ ng ñ t ñ u dòng trong danh sách − Shape 1: nh hư ng ñ n toàn danh sách − Shape 2: nh hư ng ñ n m t m c trong danh sách − Các lo i shape: o Circle: Bullet tròn, r ng o Square: Bullet vuông o Disc: Bullet tròn không r ng Ví d : Learning HTML Monday Introduction to HTML Creating Lists Tuesday Creating Tables Inserting Images Wednesday Thursday Friday III.2. DANH SÁCH CÓ TH T (OrderList – OL) Cú pháp: N i dung 1 N i dung 2 … Trang 19
ADSENSE

CÓ THỂ BẠN MUỐN DOWNLOAD

THÔNG TIN
TRỢ GIÚP
HỖ TRỢ KHÁCH HÀNG
Theo dõi chúng tôi

Chịu trách nhiệm nội dung:

Nguyễn Công Hà - Giám đốc Công ty TNHH TÀI LIỆU TRỰC TUYẾN VI NA

LIÊN HỆ

Địa chỉ: P402, 54A Nơ Trang Long, Phường 14, Q.Bình Thạnh, TP.HCM

Hotline: 093 303 0098

Email: support@tailieu.vn

Giấy phép Mạng Xã Hội số: 670/GP-BTTTT cấp ngày 30/11/2015 Copyright © 2022-2032 TaiLieu.VN. All rights reserved.

 

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