›
›

Giáo trình Lập trình Web (Bản đẹp)

pdf 103 trang huongle 4750
Download
Bạn đang xem 20 trang mẫu của tài liệu "Giáo trình Lập trình Web (Bản đẹp)", để tải tài liệu gốc về máy bạn click vào nút DOWNLOAD ở trên

Tài liệu đính kèm:

  • pdfgiao_trinh_lap_trinh_web_ban_dep.pdf

Nội dung text: Giáo trình Lập trình Web (Bản đẹp)

  1. Lập trình Web
  2. Mục tiêu môn học  Cung cấp các kiến thức cơ bản về thiết kế web  HTML, CSS, JavaScript  Tìm hiểu các thành phần cơ bản của trang web  Các bước xây dựng trang web tĩnh  Xây dựng & triển khai trang web tĩnh.  Sử dụng công cụ thiết kế web phổ biến như Dreamweaver, và các công cụ hỗ trợ khác như photoshop, flash 2
  3. Nội dung môn học  Phần 1: kiến thức cơ bản  HTML (HyperText Markup Language)  CSS (Cascading Style Sheets)  Ngôn ngữ JavaScript.  Phần 2: công cụ thiết kế web  Dreamweaver  Photoshop  Flash  Một số công cụ hỗ trợ thiết kế web khác. 3
  4. Giới thiệu môn học  Giảng viên:  ThS. Nguyễn Hà Giang  Các môn dạy:  Kỹ thuật lập trình, CTDL & GT, OOP, Lập trình Visual C++ & MFC, Lập trình C# Desktop Application, LT Web Application ASP.NET, Mã nguồn mở (PHP & MySQL), CC&MT PTPM.  Hướng nghiên cứu:  Data Mining, Fuzzy Data Mining, Fuzzy Association Rule Mining  Semantic Web Mining,  Email: nguyenha.giang@yahoo.com 4
  5. Chương 0 Các kiến thức cơ bản 5
  6. Mục tiêu  Giới thiệu mô hình 3 lớp trong thiết kế web  Các khái niệm và thuật ngữ cơ bản về mạng và môi trường web  Cấu trúc và cú pháp của ngôn ngữ HTML  Cú pháp và thuộc tính của CSS (chuẩn định dạng cách trình bày của trang web)  Tổng quan về ngôn ngữ script, cú pháp, cách xử lý sự kiện và thao tác trên đối tượng HTML của ngôn ngữ JavaScript. 6
  7. Mô hình 3 lớp trong TK Web  Lớp nội dung  Cung cấp nội dung thông tin cho người truy cập.  Bao gồm các văn bản, hình ảnh, các liên kết  Nội dung này sẽ được tổ chức theo cấu trúc của ngôn ngữ đánh dấu siêu văn bản như HTML, XHTML 7
  8. Mô hình 3 lớp trong TK Web  Lớp trình bày  Quy định cách trình bày trang web. Lớp này định nghĩa các định dạng hay kiểu mẫu cho các thành phần trong trang web.  Các định nghĩa này được lưu trong một file riêng theo cú pháp của chuẩn định dạng CSS  Lớp hành vi  Cho phép thực hiện một số hành vi/thao tác trên các thành phần của trang web thông qua ngôn ngữ script (JavaScript, VBScript) 8
  9. Mô hình 3 lớp trong TK Web  Một số ưu điểm của mô hình  Share resources  Dùng chung toàn bộ file CSS hay JS cho toàn bộ các trang web trong website.  Khi thay đổi trên tập tin này thì toàn bộ site sẽ được đổi  Faster downloads  Khi user truy cập trang web, các CSS và JS chỉ tải ở lần truy cập đầu tiên, trình duyệt sẽ cache lại cho lần sau.  Multi-person teams  Thuận tiện cho việc phân chia công việc.  Các thành viên trong nhóm sẽ được phân công theo từng lớp mô hình. Do đó công việc ở các lớp có thể làm đồng thời. 9
  10. Các khái niệm & thuật ngữ cơ bản  WWW (World Wide Web): mạng toàn cầu các máy tính sử dụng Internet để trao đổi tài liệu web.  Protocol: là tập hợp các quy tắc được thống nhất giữa hai máy tính nhằm thực hiện trao đổi dữ liệu được chính xác.  Các giao thức thông dụng: TCP, HTTP, FTP, SMTP  Web page: một tài liệu (thường là HTML) được thiết kế để phân phối trên môi trường web.  Web site: là tập hợp các web page có liên quan đến 1 công ty hay cá nhân 10
  11. Các khái niệm & thuật ngữ cơ bản  Home page: là web page có mức cao nhất, gọi là trang chủ của website.  IP Address: một con số xác định duy nhất cho mỗi máy tính trên Internet  VD: 192.168.10.1  Domain name: tên xác định website  VD: www.huflit.edu.vn  DNS (Domain name service): một chương trình chạy trên server, chuyển tên miền sang IP và ngược lại. 11
  12. Các khái niệm & thuật ngữ cơ bản  ISP (Internet Service Provider):  Nhà cung cấp dịch vụ Internet (cung cấp các dịch vụ truy cập Internet và nơi lưu trữ web).  Web host:  Một web server cung cấp dịch vụ lưu trữ cho web site của các công ty, tổ chức hay cá nhân.  12
  13. Các khái niệm & thuật ngữ cơ bản  URL (Uniform Resource Locator): Một địa chỉ web, là một chuẩn để xác định các tài liệu (trang) web trên Internet. Giao thức cổng Tập tin Tên vị trí trong trang web Tên miền Thư mục Tham số 13
  14. Các khái niệm & thuật ngữ cơ bản  Port: là con số xác định kênh nhập/xuất được sử dụng bởi một ứng dụng Internet.  Một máy server có thể cung cấp nhiều dịch vụ, do đó cần có cơ chế để phân biệt, giúp client khai thác đúng dịch vụ cần thiết.  Hai dịch vụ khác nhau phải chạy trên hai cổng khác nhau.  VD: web server thường dùng cổng 80, ftp server dùng cổng 21, smtp server dùng cổng 25 14
  15. Các khái niệm & thuật ngữ cơ bản  Web client (Web Browser): là phần mềm dùng để truy cập và hiển thị nội dung trang web.  Một số web browser thông dụng như: IE, Firefox, Opera, Safari, Chrome  Web server: một máy tính phân phối dịch vụ và thông tin cho máy tính khác.  Một số web server thông dụng: IIS, Apache, Tomcat 15
  16. Các khái niệm & thuật ngữ cơ bản  Server: chứa dữ liệu, tài nguyên và dịch vụ cho phép máy khác có thể khai thác và truy cập.  Một máy chủ có thể dùng cho một hay nhiều mục đích.  Tên máy chủ thường được gắn với mục đích sử dụng  VD: Web server, File server, Mail server  Client: là máy tính dùng để kết nối và khai thác các tài nguyên trên máy chủ  Việc kết nối client với server và việc khai thác dịch vụ của server tạo nên mô hình Client/Server  Một máy tính vừa có thể là server vừa là client. 16
  17. Các khái niệm & thuật ngữ cơ bản  Trang web tĩnh:  Chứa nội dung cố định (thường là HTML, để cập nhật nội dung phải cập nhật trực tiếp trên HTML).  Không cho phép sử dụng tương tác, cập nhật dữ liệu trên trang web.  Một trang web chứa các hình ảnh chuyển động cũng có thể là trang web tĩnh!  Trang web động:  Kết hợp HTML và mã lệnh.  Mã được thực thi trực tiếp trên server, gửi kết quả là HTML về người sử dụng.  Có khả năng tương tác với người sử dụng! 17
  18. Xử lý yêu cầu với web tĩnh 18
  19. Xử lý yêu cầu với web động 19
  20. Chương 1 Ngôn ngữ HTML 20
  21. Nội dung  Giới thiệu ngôn ngữ HTML  Cấu trúc tổng quát trang HTML  Các thẻ HTML cơ bản  Các ký tự đặc biệt  Thiết kế bảng  Chia khung  Tạo form 21
  22. HTML - nền tảng của web  HTML: HyperText Markup Language – ngôn ngữ đánh dấu siêu văn bản.  Do Tim Berner-Lee phát minh và trở thành ngôn ngữ chuẩn để tạo trang web.  HTML dùng các thẻ (tags) để định dạng dữ liệu  Tạo khung/bảng cho trang web 22
  23. Cấu trúc tổng quát trang HTML 23
  24. Các thẻ HTML cơ bản  Các thành phần cơ bản (tag, element, property)  Các thẻ HTML cơ bản.  Thẻ định dạng trang:  Thẻ định dạng văn bản: , , , ,  Thẻ tạo siêu liên kết (hyperlink):  Thẻ định dạng danh sách: , ,  Thẻ chèn hình ảnh: 24
  25. Các thành phần cơ bản  Thẻ (tag): là một tập hợp ký hiệu được định nghĩa trong HTML có ý nghĩa đặc biệt.  thẻ bắt đầu bởi " "  thẻ mở:  thẻ đóng:  Phần tử (element): có thể bao gồm thẻ mở, thẻ đóng và nội dung bên trong cặp thẻ mở, đóng.  Có hai loại phần tử trong HTML  Phần tử chứa nội dung: bao gồm thẻ mở và thẻ đóng  VD: Nội dung  Phần tử rỗng: bao gồm một thẻ  VD: có thể viết là hoặc 25
  26. Các thành phần cơ bản  Thuộc tính: mỗi thẻ có thể một hay nhiều thuộc tính đi kèm. Thuộc tính được nhập ngay trước ngoặc đóng ‘>’ của thẻ mở.  Có thể có nhiều thuộc tính trong một thẻ, các thuộc tính phân cách nhau khoảng trắng.  Các giá trị thuộc tính có thể đặt trong “ ”, ‘ ’ hoặc không có.  Nếu giá trị là chuỗi ký tự có khoảng trắng bên trong, bắt buộc phải dùng “ ” hay ‘ ’ để bao chuỗi lại  VD: 26
  27. Thẻ định dạng trang  Một số thuộc tính của thẻ body 27
  28. Thẻ định dạng văn bản 28
  29. Thẻ định dạng văn bản 29
  30. Thẻ tạo hyperlink  Hyperlink: cho phép người dùng có thể duyệt từ trang web này đến trang web khác.  Gồm 3 phần:  Nguồn: chứa nội dung hiển thị khi user truy cập đến, có thể trang web khác, một đoạn film, một hình ảnh hoặc hộp thoại gởi email.  Nhãn: có thể là dòng văn bản, hình ảnh để người dùng kích vào. Nếu 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ị. 30
  31. Thẻ tạo hyperlink  Có hai dạng liên kết:  Internal hyperlink: là 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 website.  External hyperlink: là liên kết với các trang trên website khác  Cú pháp: URL: Địa chỉ của trang liên kết Nhãn: Có thể là dòng text hoặc hình ảnh hoặc một button 31
  32. Thẻ tạo hyperlink - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 32
  33. Thẻ tạo hyperlink  Dùng URL tương đối để liên kết đến các trang trong cùng một website Ví dụ: Using links 33
  34. Thẻ tạo hyperlink  Dùng URL tuyệt đối để liên kết đến các trang trong website khác Ví dụ: Link 34
  35. Thẻ tạo hyperlink  Liên kết đến các phần trong cùng trang:  Nếu nội dung trang web quá dài thì nên tạo bookmark, để giúp người nhanh chóng chuyển đến phần nội dung cụ thể nào đó.  Gồm hai bước  Tạo bookmark: Nội dung phần văn bản  Tạo liên kết đến bookmark 35
  36. Thẻ tạo hyperlink  Liên kết đến các bookmark trong trang khác: 36
  37. Thẻ tạo hyperlink  Các thuộc tính của thẻ 37
  38. Thẻ tạo hyperlink  Nên tạo chú thích cho liên kết giúp người đọc biết trang cần tới  Nên dùng một màu thống nhất cho tất cả các liên kết  Khi link không chỉ tới trang HTML mà tới một tài liệu dạng khác: doc, pdf, ppt thì nên tạo biểu tượng bên cạnh.  Không nên tạo link đến trang đang xây dựng. 38
  39. Thẻ định dạng danh sách 39
  40. Thẻ định dạng danh sách  UnOrder List – UL Nội dung 1 Nội dung 2  Shape 1, Shape 2 là bullet tự động đặt ở đầu danh sách.  Shape 1: ảnh hưởng đến toàn danh sách  Shape 2: ảnh hưởng đến một mục danh sách  Các loại shape: circle (tròn rỗng), square (vuông), Disc (tròn đặc) 40
  41. Thẻ định dạng danh sách  Order List – OL Nội dung 1 Nội dung 2  x là loại ký tự dùng trong ds  A: chữ hoa  a: chữ thường  I: số La Mã hoa  i: số La Mã thường  n: là giá trị bắt đầu  m: là giá trị thiết lập riêng cho item.  x1: là ký tự sử dụng của dòng này 41
  42. Danh sách định nghĩa  Trong HTML có tag đặc biệt dùng để tạo danh sách định nghĩa phục vụ cho việc tra cứu, diễn giải.  Cú pháp: Nhập từ muốn định nghĩa Nhâp nội dung định nghĩa 42
  43. Danh sách định nghĩa  Minh họa Pixel Short for picture element. A pixel refers to the small dots that make up an image on the screen. Pixel depth refers to the number of colours which may be displayed. Resolution The quality of the display on a monitor. The higher the resolution, the sharper the image. The number of pixels that can be displayed on a screen defines resolution. Scanner A hardware device that allows the user to make electronic copies of graphics or text. 43
  44. Hình ảnh trên web  Các loại ả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.  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 rõ 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.  PNG (Portable Network Graphics): nén không mất dữ liệu. 44
  45. thẻ chèn hình ảnh  Cú pháp:  URL: thường sử dụng địa chỉ tương đối  Nếu hình chứa trong thư mục image và tập tin .htm chứa trong thư mục html thì địa chỉ của hình chèn có dạng Src=“ /image/hinh1.gif”  Nếu hình và tập tin .html chứa trong cùng một thư mục thì địa chỉ hình chèn có dạng: Src=“hinh1.gif” 45
  46. Thẻ chèn hình ảnh - 46
  47. Thẻ chèn hình ảnh  Có thể chỉ xác định cho thuộc tính width hoặc height, khi đó thuộc tính còn lại sẽ được tính theo tỷ lệ  Vd: kích thước ảnh là 200,100 nếu xác định width là 100 thì height sẽ được tính là 50!  Giá trị URL của thuộc tính src  Có thể dùng địa chỉ tương đối (không có tên miền, chỉ xác định tên thư mục và tên tập tin, nếu ảnh nằm trong site chứa trang web)  Hay địa chỉ tuyệt đối (URL đầy đủ đến tập tin ảnh). 47
  48. Thẻ chèn hình ảnh  VD 48
  49. Thẻ chèn hình ảnh  Các hình ảnh nên lưu trong thư mục riêng (như thư mục image) 49
  50. Thẻ chèn hình ảnh • Để hình ảnh xuất hiện riêng một dòng, ta chỉ cần thêm tag . • Ví dụ: 50
  51. Thẻ chèn hình ảnh  Khi thêm hai thuộc tính Width và height giúp cho web hiển thị nhanh hơn. 51
  52. Thẻ chèn hình ảnh  Sắp xếp hình ảnh với văn bản xung quanh Chèn ảnh vào giữa thì làm thế nào? 52
  53. Thẻ chèn hình ảnh  Đặt tag có canh lề trước tag trước tag align style: Left: hình ảnh chèn vào bên trái văn bản Center: hình ảnh chèn vào giữa văn bản Right: hình ảnh chèn vào bên phải văn bản 53
  54. Thẻ chèn hình ảnh  Sắp xếp trong hàng của văn bản và hình ảnh Trong đó: – Value có các giá trị sau: • Top: Dòng văn bản ngang với đỉnh của ảnh. • Middle: Dòng văn bản nằm khoảng giữa ảnh. • Bottom: Dòng văn bản bằng với đáy của ảnh. (luôn mặc định) 54
  55. Thẻ chèn hình ảnh align=top 55
  56. Thẻ chèn hình ảnh  align=middle 56
  57. Thẻ chèn hình ảnh  align=bottom 57
  58. Thẻ chèn hình ảnh • Ngoài ra ta có thể thêm từ khóa align=right/left vào trong tag . • Để có viền khung hoặc không, ta sử dụng khoá Border=N trong tag . – Trong đó N là số nguyên lớn hơn hoặc bằng 0, chỉ độ dày của viền khung. 58
  59. Thẻ chèn hình ảnh • align="right" 59
  60. Thẻ chèn hình ảnh align="left" 60
  61. Thẻ chèn hình ảnh  Khi sử dụng align = left/right, thì text sẽ wrap xung quanh ảnh cho đến phần cuối cùng của ảnh  Muốn bỏ tác dụng này dùng 61
  62. Các ký tự đặc biệt 62
  63. Thiết kế bảng 63
  64. Thiết kế bảng - thuộc tính thẻ Table 64
  65. Thiết kế bảng - thuộc tính thẻ 65
  66. Thiết kế bảng - thẻ , 66
  67. Thiết kế bảng 67
  68. Dùng table để trình bày trang  Bảng thường được dùng để trình bày bố cục (layout) trang web  Dùng table để  thiết kế một trang thể hiện văn bản dạng cột báo chí,  phân trang thành các vùng có chủ đề khác nhau  Mỗi cell trong table có thể sử dụng bất cứ tag HTML.  Chèn một danh sách có thứ tự trong cell  Chèn một tag  Hoặc chèn một table vào trong cell 68
  69. Dùng table để trình bày trang  Tạo một trang có một dòng và 2 cột Phần danh mục liên kết Bảng 2 69
  70. Dùng table để trình bày trang Table 2 chèn logo Nội dung 2 Nội dung 1 Nội dung 3 70
  71. Dùng table trình bày trang  Kết quả trình bày khi ghép lại Bố cục của một trang web 71
  72. Dùng table trình bày trang  Thiết kế mẫu sau 1 2 3 4 5 6 72
  73. Frame  Mở rộng khả năng hiển thị trang web bằng cách cho phép chia miền hiển thị thành nhiều vùng  Vùng được chia gọi là frame, có đặc điểm sau:  Có thể truy cập đến URL độc lập với frame khác  Có thể thay đổi kích thước khung nhìn, hoặc không cho phép thay đổi đối với user  Trong trang đã dùng frame thì không có tag body 73
  74. Frame  Cú pháp của Frame 74
  75. Frame Thẻ Frameset  rows: chỉ chia hàng, tuỳ theo tham số.  cols: chỉ chia cột, tuỳ theo tham số.  border: độ dày đường viền.  framespacing: khoảng cách các frame. 75
  76. Frame  n1, n2, m1, m2, : là giá trị thuộc tính được tính bằng pixel hoặc phần trăm tương đối. Và có thể là dấu '*', frame tương ứng sẽ tự động điều chỉnh.  N: là độ dày tương ứng với các thuộc tính.  frameborder: thiết lập đường viền cho toàn bộ tập frame, có giá trị yes hoặc no. 76
  77. Frame  Ví dụ chia thành 2 hàng, hàng thứ nhất chiếm 30% màn hình, còn lại là hàng thứ 2. chia 3 cột, cột thứ 2 có độ rộng 100 điểm, các cột còn lại sẽ tự động phân chia. : đặt đường viền, khoảng cách, 77
  78. Frame  Thẻ frame  Cú pháp 78
  79. Frame – noresize: nếu có thuộc tính này thì người sử dụng không thể thay đổi kích thước hiển thị frame. – name: gán một tên cho một frame, nó có thể làm đích cho các liên kết từ các tài liệu khác. – with: chiều rộng frame. – height: chiều cao frame. – scrolling: đặt thuộc tính thanh cuốn. 79
  80. Frame  VD tạo trang web có 4 frame như sau 80
  81. Frame  Phần HTML của trang chính Trình duyệt không hỗ trợ Frame  Tạo các trang con Header.html, left.html, main.html, footer.html 81
  82. Frame  Thiết kế frame có dạng sau 82
  83. Frame  Thiết kế frame có dạng sau 83
  84. Form  Form dùng để nhận thông tin từ người sử dụng hay phản hồi thông tin về người sử dụng.  Người dùng có thể có các yêu cầu  Nhập vào câu trả lời, ý kiến  Chọn câu trả lời từ danh sách  Chọn câu trả lời từ một hoặc một số tùy chọn  Dữ liệu có thể xử lý tại client hoặc có thể xử lý ở server. Sau đó kết quả trả về cho người dùng.  Sử dụng tag để tạo form trong trang web 84
  85. Form  Thuộc tính của tag form 85
  86. Form  Phương thức HTTP (HTTP methods)  Post: dữ liệu chứa trong phần thân của request  Get: dữ liệu được gởi kèm theo URL được mô tả trong action, có dạng sau  URL?name1= value1& name2=value2  Lưu ý:  Khi dùng Get, tất cả thông tin thu được sẽ hiển thị lên address bar  Thường dùng get khi cần bookmark trang hiện hành do các thông tin cần lấy không mang tính quan trọng, bảo mật.  Post thường được dùng để che dấu thông tin 86
  87. Form 87
  88. Form  Textbox  TextArea 88
  89. Form  Textbox, passwordBox, Reset, Submit Button  FileField 89
  90. Form  RadioButton  CheckBox 90
  91. Form  ComboBox  ListBox 91
  92. Form  FieldSet: nhóm các đối tượng giống nhau vào một phần logic Chú thích Các thành phần trong nhóm  Tag legend: tạo chú thích của nhóm  Cho phép canh lề chú thích 92
  93. Form Position Application for the post of: Educational Qualifications Graduate Postgraduate 93
  94. Form  Kết quả 94
  95. Form  Tạo form có dạng sau  Form cho phép user nhập vào các thông tin và hiển thị lại các thông tin user đã nhập. 95
  96. Form  Nhập liệu 96
  97. XHTML  XHTML = EXtensible HyperText Markup Language  XHTML là sự kết hợp giữa HTML và XML  XHTML gồm tất cả các phần tử (element) trong HTML 4.1 và được kết hợp theo cú pháp của XML 97
  98. Tại sao sử dụng XHTML  Vì XHTML là sự kết hợp giữa HTML và XML, do đó tài liệu XHTML chính là một tài liệu HTML nhưng được bổ sung thêm sự chặt chẽ trong cú pháp của XML  (đảm bảo cấu trúc của trang web luôn thoả điều kiện “well- formed”)  Trình duyệt có thể sẽ hiển thị trang XHTML nhanh hơn trang HTML (vì không mất thời gian để kiểm tra và sửa lỗi “well-formed”) 98
  99. Well-formed element  Đối với các phần tử có chứa nội dung, phải có đầy đủ thẻ mở và thẻ đóng.  Đối với các phần tử rỗng, phải được thêm vào ký tự kết thúc “/”.  Các thẻ lồng nhau phải đúng trật tự, không chồng lấp lên nhau.  Thỏa well-formed element  Không thỏa well-formed element wrong 99
  100. Well-formed document  Các phần tử phải well-formed  Tồn tại phần tử đơn, xem như phần tử gốc, chứa tất cả các phần tử khác Normal emphasized strong emphasized strong Normal emphasized strong emphasized strong Alternatively emphasized strong emphasized strong 100
  101. So sánh HTML vs XHTML  XHTML  Các thẻ lồng nhau phải đúng trật tự  Các thẻ và các thuộc tính của các phần tử cần phải được viết bằng chữ thường  Các thuộc tính của các phần tử phải được đóng nháy kép. Ví dụ:  Không cho phép giản lược các thuộc tính.  Ví dụ trong HTML có thể viết nhưng trong XHTML cần phải được viết lại và phải được đóng bằng thẻ 101
  102. So sánh HTML vs XHTML  Các thẻ được gọi là noempty cần phải được đóng bằng một thẻ đóng.  Những thẻ không gọi là noempty như có thể được đóng bằng một thẻ hoặc nếu không phải được viết .  Thuộc tính name được thay thế bằng thuộc tính id  Phải có khai báo DOCTYPE trước thẻ 102
  103. Cấu trúc tối thiểu tập tin XHTML  Title goes here Body text goes here 103