Bài giảng HTML – DHTML - Javascript (Thiết kế Web): Bài 1 - Lê Quang Lợi

Bài 1 trình bày về tài liệu HTML. Nội dung trình bày trong chương này gồm: Khái quát về HTML, tài liệu HTML, làm việc với HTML và tài liệu HTML, công cụ HTML, làm việc với các thẻ HTML, các quy định trong HTML.
Nội dung trích xuất từ tài liệu:
Bài giảng HTML – DHTML - Javascript (Thiết kế Web): Bài 1 - Lê Quang LợiLê Quang LợiBài 01: Tài liệu HTMLNội dung » Khái quát về HTML » Tài liệu HTML » Làm việc với HTML và tài liệu HTML » Công cụ HTML » Làm việc với các thẻ HTML » Các quy định trong HTMLLê Quang Lợi: loilequang@gmail.com HTML-DHTML-Javascript CNPM-CNTT-ĐHSPKT HY1.1 Giới thiệu về HTML» HTML: (Hypertext Markup Language) Ngôn ngữ đánh dấu siêu văn bản (Text, âm thanh, viedeo, tương tác ..)» HTML: Dùng thẻ (tag) để hiển thị văn bản, âm thanh, hình ảnh, các dữ liệu đa phương tiện trên trang web» File HTML: gồm các thẻ HTML với nằm trong file .html, .html, xhmlt» Một trang web: HTML + CSS + Javascript» Phiên bản: 1.0, 4.1 và hiện nay 5.0» HTML: cho phép thiết kế giao diện trang webLê Quang Lợi: loilequang@gmail.com HTML-DHTML-Javascript CNPM-CNTT-ĐHSPKT HY1.1 Giới thiệu về HTML» Trình duyệt là các chương trình:  Tải (download): trang web về phía máy khách (Client)  Hiển thị nội dung trang web (giao diện)Ví dụ: IE, FireFox, Chrome ….» Trình soạn thảo: chương trình cho phép tạo file HTML.Ví dụ: WordPad, NotePad, ViSualStudio, Dreamweaver …» Quy trình : Mở trình soạn thảo => Tạo nội dung => Ghi file .html(.html) => Chạy trên trình duyệt => Thay đổi nội dung nếu cần thiếtLê Quang Lợi: loilequang@gmail.com HTML-DHTML-Javascript CNPM-CNTT-ĐHSPKT HY1.2 Tài liệu HTML - Thẻ mô tả cấu trúc tài liệu HTML HTML - Là thẻ duy nhất trong file HTML - Thẻ Tile: Tiêu đề trang web Trang HML - Chỉ có 01 và hiển thị trên thanh tiêu đề của trang web - Thẻ Body: nội dung tài liệu HTML - Chỉ có duy nhất và chứa các thẻ HTML, thể hiện giao diện web Lê Quang Lợi: loilequang@gmail.com HTML-DHTML-Javascript CNPM-CNTT-ĐHSPKT HY1.2 Tài liệu HTML Dạng tài liệu HTML khác Chào các bạn Chào các bạn Chào các bạn Chú ý: - Trong tài liệu HTML chỉ có 01 thẻ: HTML, BODY, Head, Title - Có thể có nhiều các thẻ khác và các thẻ có thể lồng nhauLê Quang Lợi: loilequang@gmail.com HTML-DHTML-Javascript CNPM-CNTT-ĐHSPKT HY1.3 Thẻ trong HTML» Thẻ (Tag): Quy định nội dung hiển thị trong tài liệu HTML» Tài liệu HTML: được tạo thành từ nhiều thẻ html» Trong tài liệu HTML có nhiều thẻ khác nhau thể hiện nội dung • Thẻ cơ bản: HTML, Head, Title, Meta … • Thẻ văn bản: DIV,P, Heading, font, hr, br … • Thẻ bảng: Table, Thead, Tbody, tfoot, tr, td • Thẻ nhập liệu: Input (text, submit, reset),Textarea, Radio… • Thẻ đặc biệt: link, Script, Object, Embeded…Lê Quang Lợi: loilequang@gmail.com HTML-DHTML-Javascript CNPM-CNTT-ĐHSPKT HY1.4 Một số thẻ cơ bản» Head: Phần đầu của tài liệu.» Title: thể hiện tiêu đề cho trang web» Meta: thể hiện các quy dịnh đặc biệt của trang web • Thuộc tính codepage: quy định mã chứa tài liệu HTML • UTE-F8, 65500 …» HTML: Quy định nội dung tài liệu HTML» Body:thân tài liệu HTML» Thẻ chú thích: - Không hiển thị trên trình duyệt - Mô tả cho đoạn mã HTML trong tài liệuLê Quang Lợi: loilequang@gmail.com HTML-DHTML-Javascript CNPM-CNTT-ĐHSPKT HY1.4 Một số thẻ cơ bản» Div: Phân chia tài liệu HTML thành từng phần khác nhau => Dùng chủ yếu để thiết kế giao diện trang HMTLVí dụ: đầu Giữa Cuối» Span: Thể hiện nội dung dạng nhỏ, làm nhã cho thẻ inputVí dụ: Tên » Hr: chỉ ra dòng kẻ với độ rộng quy đinh bởi size Ví dụ: Lê Quang Lợi: loilequang@gmail.com HTML-DHTML-Javascript CNPM-CNTT-ĐHSPKT HY1.3 Thẻ trong HTML» Cú pháp thẻ Nội dung » Thẻ nằm trong cặp: “”  Thẻ mở: , thẻ đóng “”  Thẻ mở: ”» Nội dung: thể hiện phần được hiển thị » văn bản, âm thanh, hình ảnh» Thuộc tính: quy định việc hiển thị nội dungLê Quang Lợi: loilequang@gmail.com HTML-DHTML-Javascript CNPM-CNTT-ĐHSPKT HY1.3 Thẻ trong HTML» Thuộc tính: quy định việc hiển thị nội dung • Màu nền, hình nền, hiệu ứng văn bản • Kích thước, căn lề, vị trí, font chữ …» Sự kiện: Sự tương tác của người dùng (chuột + bàn phím)» Sử dụng thẻ: • Chỉ ra tên thẻ, các thuộc tính, nội dung của thẻ • Thẻ mở thì phải có thẻ đóng • Thẻ có thể: bao nhau và không được mắc xích vào nhau, • Thẻ nên viết bằng các ký tự thường (HTML5)Lê Quang Lợi: loilequang@gmail.com HTML-DHTML-Javascript CNPM-CNTT-ĐHSPKT HY1.4 Một số thẻ cơ bản=> Một số ...