Giáo trình HTML và javascript

VIETHANIT MỤC LỤC CHƯƠNG 1................................................................................................................................1 GIỚI THIỆU CHUNG................................................................................................................1 Các ngôn ngữ đánh dấu dùng cho thiết bị điện tử...................................................................1 Ngôn ngữ đánh dấu thiết bị cầm tay...................................................................................1 Ngôn ngữ đánh dấu vô tuyến..............................................................................................1 Ngôn ngữ đánh dấu siêu văn bản thu nhỏ...........................................................................1 Các ngôn ngữ đánh dấu văn bản ứng dụng Web....................................................................2 Ngôn ngữ đánh dấu siêu văn bản........................................................................................2 Ngôn ngữ đánh dấu mở rộng...............................................................................................2 Ngôn ngữ XHTML.............................................................................................................2 Ngôn ngữ DHTML.............................................................................................................3 Ngôn ngữ đánh dấu siêu văn bản (HTML).............................................................................3 Giới thiệu HTML................................................................................................................3 Đặc điểm của HTML..........................................................................................................4 Cấu trúc của một tài liệu HTML.........................................................................................5 Qui trình tạo một tài liệu HTML.........................................................................................6 CHƯƠNG 2................................................................................................................................8 CÁC THẺ CƠ BẢN TRONG HTML........................................................................................8 Thẻ và các thuộc tính của thẻ..................................................................................................8 Các thẻ cơ bản trong HTML...................................................................................................9 Thẻ xác định văn bản HTML..............................................................................................9 Thẻ xác định phần đầu cho trang web.................................................................................9 Thẻ xác định tiêu đề cho văn bản HTML...........................................................................9 Thẻ xác định các danh mục trang web.............................................................................10 Thẻ tạo danh sách..............................................................................................................11 Thẻ tạo danh sách không thứ tự....................................................................................12 Thẻ tạo danh sách có thứ tự..........................................................................................14 Thẻ xác định văn bản trang web...................................................................................19 Thẻ tạo đường thẳng.........................................................................................................19 Thẻ xác định dòng chú thích.............................................................................................21 Các thẻ vận dụng với văn bản...............................................................................................21 Thẻ vận dụng cho kiểu chữ...............................................................................................21 2.3.1.1 Làm chữ đậm.....................................................................................................21 2.3.1.2 Làm chữ in nghiêng.........................................................................................22 2.3.1.3 Thay đổi kích thước chữ...................................................................................23 2.3.1.4 Tạo dòng chữ thấp.............................................................................................23 2.3.1.5 Tạo dòng chữ cao..............................................................................................24 2.3.1.6 Gạch ngang và gạch dưới chữ...........................................................................25 2.3.1.7 Tạo chữ dạng riêng............................................................................................25 2.3.1.8 Tạo dạng chữ bị xoá..........................................................................................25 2.3.1.9 Tạo dạng chữ chèn vào.....................................................................................25 Thẻ vận dụng cho hiệu ứng font chữ................................................................................25 2.3.2.1 Chọn font chữ cho văn bản...............................................................................25 2.3.2.2 Đổi cỡ chữ văn bản...........................................................................................26 2.3.2.3 Chọn cỡ chữ mặc định......................................................................................27 2.3.2.4 Đổi màu chữ......................................................................................................27 2.3.2.5 Làm chữ nhấp nháy...........................................................................................27 Thẻ vận dụng trình bày trang Web........................................................................................27 Lựa chọn màu nền.............................................................................................................27 HTML và JavaScript Trang i VIETHANIT Lựa chọn hình ảnh làm nền...............................................................................................28 Chỉnh lề cho trang Web....................................................................................................29 Tạo đoạn văn bản..............................................................................................................29 Ngắt đoạn..........................................................................................................................30 Một số thẻ đặc biệt khác.......................................................................................................31 Thẻ làm việc với siêu liên kết...........................................................................................31 Giới thiệu siêu liên kết và URL....................................................................................31 Sử dụng siêu liên kết.....................................................................................................32 Thẻ Meta...........................................................................................................................38 Các thẻ DIV và SPAN......................................................................................................39 Các thẻ mức đoạn..............................................................................................................40 2.5.3.1 Thẻ .............................................................................................40 2.5.3.2 Thẻ ....................................................................................41 2.5.3.3 Thẻ ........................................................................................................42 Sử dụng ký tự đặc biệt trong tài liệu HTML.........................................................................43 CHƯƠNG.................................................................................................................................48 LÀM VIỆC VỚI BẢNG - BIỂU MẪU – KHUNG VÀ ĐA PHƯƠNG TIỆN....................48 Làm việc với bảng.................................................................................................................48 Cách tạo bảng....................................................................................................................48 Các thuộc tính của bảng....................................................................................................50 Thuộc tính của thẻ ......................................................................................50 Thuộc tính của thẻ ..............................................................................................50 Thuộc tính của thẻ ..............................................................................................51 Hiệu chỉnh bảng................................................................................................................52 Tạo khung viền cho bảng..............................................................................................52 Thay đổi kích thước bảng..............................................................................................53 Bổ sung cạnh và đường kẻ lưới.....................................................................................53 Trang trí văn bản chung quanh bảng.............................................................................54 Kết hợp các cột và các dòng.........................................................................................55 Canh lề nội dung trong ô...............................................................................................57 Sử dụng hình ảnh làm nền cho bảng.............................................................................57 Làm việc với biểu mẫu..........................................................................................................59 Sử dụng biểu mẫu..............................................................................................................59 Phần tử FORM..................................................................................................................59 Các phần tử nhập của HTML............................................................................................60 Phần tử INPUT..............................................................................................................60 Button............................................................................................................................61 Textbox.........................................................................................................................61 Checkbox......................................................................................................................61 Radio.............................................................................................................................62 Submit...........................................................................................................................62 Ảnh................................................................................................................................63 Reset..............................................................................................................................63 Phần tử TextArea..........................................................................................................64 Phần tử BUTTON.........................................................................................................65 Phần tử Select................................................................................................................67 Phần tử LABEL.............................................................................................................70 Tạo biểu mẫu.....................................................................................................................71 Thiết lập tiêu điểm (Focus)...........................................................................................73 Thứ tự tab......................................................................................................................74 Phím truy cập (Access Keys)........................................................................................74 HTML và JavaScript Trang ii VIETHANIT Phần tử vô hiệu hoá.......................................................................................................74 Làm việc với khung..............................................................................................................74 dụng...................................................................................................................................75 Tại sao sử dụng khung?.....................................................................................................75 Làm việc với khung.........................................................................................................75 3.3.2.1 Sử dụng khung..................................................................................................75 3.3.2.2 Liên kết các khung............................................................................................80 3.3.2.3 Phần tử NOFRAMES........................................................................................81 3.3.2.4 Phần tử IFRAMES (inline frame).....................................................................82 Làm việc với đa phương tiện................................................................................................83 Sử dụng hình ảnh trong tài liệu HTML.............................................................................83 Chèn ảnh tĩnh................................................................................................................84 Chèn ảnh động (.GIF) vào tài liệu HTML....................................................................86 Chèn âm thanh vào tài liệu HTML...................................................................................87 Chèn video vào tài liệu HTML.........................................................................................88 CHƯƠNG 4..............................................................................................................................89 STYLE SHEET.........................................................................................................................89 DHTML................................................................................................................................89 Giới thiệu DHTML...........................................................................................................89 Các đặc điểm của DHTML...............................................................................................90 Style sheet.............................................................................................................................91 4.2.1 Khái niệm, chức năng và các lợi ích của style sheet................................................91 4.2.2 Quy tắc stylesheet....................................................................................................94 4.2.3 Các Selector trong style sheet..................................................................................96 4.2.4 Kết hợp và chèn một style sheet vào tài liệu HTML.............................................103 4.2.5 Thiết lập thuộc tính trong style sheet.....................................................................105 CHƯƠNG 5............................................................................................................................106 TỔNG QUAN VỀ JAVASCRIPT..........................................................................................106 5.1 Giới thiệu về Javascript.................................................................................................106 Javascript.........................................................................................................................106 Tìm hiểu lịch sử của JavaScript......................................................................................106 Nguồn gốc của JavaScript...........................................................................................107 JavaScript đến với Internet Explorer...........................................................................107 JavaScript trở thành chuẩn chính thức........................................................................107 JavaScript hiện nay đã phát triển đến đâu?.................................................................108 Nhúng Javascript vào file HTML...................................................................................108 Dùng thẻ ...................................................................................................109 Dùng file bên ngoài.....................................................................................................110 Dùng JavaScript trong trình xử lý sự kiện..................................................................111 Thẻ và ...........................................................................112 Biến, hằng và các kiểu dữ liệu trong JavaScript.................................................................113 5.2.1 Biến và phân loại biến............................................................................................113 5.2.2 Hằng.......................................................................................................................114 5.2.3 Các kiểu dữ liệu trong JavaScript..........................................................................115 5.2.3.1 Kiểu số nguyên................................................................................................116 5.2.3.2 Kiểu số thực (kiểu số dấu chấm động)............................................................116 5.2.3.3 Kiểu Logical (hay Boolean)............................................................................116 5.2.3.5 Kiểu null..........................................................................................................117 Câu hỏi và bài tập................................................................................................................118 CHƯƠNG 6............................................................................................................................119 TOÁN TỬ VÀ BIỂU THỨC TRONG JAVASCRIPT..........................................................119 HTML và JavaScript Trang iii VIETHANIT 6.1 Các toán tử trong JavaScript.........................................................................................119 6.1.1 Các toán tử thông dụng..........................................................................................119 6.1.1.1 Toán tử gán.....................................................................................................119 6.1.1.2 Toán tử số học.................................................................................................120 6.1.1.3 Toán tử so sánh...............................................................................................121 6.1.1.4 Toán tử logic...................................................................................................122 6.1.1.5 Toán tử thao tác trên bit.................................................................................123 6.1.1.6 Toán tử chuỗi..................................................................................................125 6.1.2 Một số toán tử khác................................................................................................126 6.1.2.1 Toán tử điều kiện...........................................................................................126 6.1.2.2 Toán tử dấu phẩy....................