Bài giảng HTML Ngôn ngữ đánh dấu siêu văn bản

HTML Ngụn ngữ đỏnh dấu siờu văn bản TRỊNH CễNG DUY Website: Khỏi quỏt Tạo lập trang Web là một vấn đề đơn giản, chỉ cần đỏnh văn bản vào rồi chốn thờm cỏc ký hiệu đỏnh dấu, gọi là thẻ cú dạng như sau:văn bản chịu tỏc động Tập tin HTML luụn bắt đầu bằng thẻ và kết thỳc bằng Cỏc file web tỉnh luụn cú phần mở rộng là *.htm hay *.html nhằm bỏo cho trỡnh duyệt biết mà thực thi. Cỏc file web tỉnh khụng cần Server khi chạy, chỉ cần nhấn đụi vào là đó cú thể thực thi. Tổng quan trang web Html Cỏc trang Web khỏc nhau, tẻ nhạt hay sinh động, vụ nghĩa hoặc rất cần thiết, nhưng tất cả đều cú cựng một cấu trỳc cơ sở, nờn đa số cỏc trỡnh duyệt đang chạy trờn hầu hết cỏc kiểu mỏy tớnh đều cú thể hiển thị thành cụng hầu hết cỏc trang Web . Cấu trỳc căn bản của trang web Tiờu đề ... Nội dung của trang Web I Các thẻ định cấu trúc tài liệu 1.1 HTML Cặp thẻ này được sử dụng để xác nhận một tài liệu là tài liệu HTML, tức là nó có sử dụng các thẻ HTML để trình bày. Toàn bộ nội dung của tài liệu được đặt giữa cặp thẻ này. Cú pháp: Trình duyệt sẽ xem các tài liệu không sử dụng thẻ như những tệp tin văn bản bình thường. Nội dung 1.2 HEAD Thẻ HEAD được dùng để xác định phần mở đầu cho tài liệuCú pháp: 1.3 TITLE Cặp thẻ này chỉ có thể sử dụng trong phần mở đầu của tài liệu, tức là nó phải nằm trong thẻ phạm vi giới hạn bởi cặp thẻ . Cú pháp: Tiờu đề Phần đầu 1.4 BODY Thẻ này được sử dụng để xác định phần nội dung chính của tài liệu - phần thân (body) của tài liệu. Trong phần thân có thể chứa các thông tin định dạng nhất định để đặt ảnh nền cho tài liệu, màu nền, màu văn bản siêu liên kết, đặt lề cho trang tài liệu... Những thông tin này được đặt ở phần tham số của thẻ. Cú pháp: .... phần nội dung của tài liệu được đặt ở đây Các tham số của thẻ BODY 2.2. Các thẻ định dạng đề mục H1/H2/H3/H4/H5/H6 HTML hỗ trợ 6 mức đề mục 2.2. Các thẻ định dạng xuống dòng Khi gặp thẻ này văn bản tự xuống dòng Thẻ : Với thẻ này văn bản sẽ kết thúc một đoạn và xuống hàng (Khoảng cách của văn bàn mới và văn bản cũ lớn hơn bình thường) Thẻ : Với thẻ này văn bản sẽ xuống hàng giống như ta gõ Enter Ví dụ Cộng hoà xó hội chủ nghĩa Việt nam Độc lập - Tự do - Hạnh phỳcĐơn xin việc Kết quả Cộng hoà xó hội chủ nghĩa Việt nam Độc lập - Tự do - Hạnh phỳc  Đơn xin việc 2.3 Đường kẻ ngang       Đường kẻ ngang chủ yếu được dựng để phõn định một trang Web thành những phần cú tớnh logic và dễ nhỡn II. Các thẻ định dạng văn bản 2.1 Thẻ … Cho phép định dạng văn bản bằng các cấu trúc của chúng. Cú pháp: … Các giá trị cho tham số ALIGN: 2.2 Sử dụng màu sắc trong thiết kế Web Một màu được tổng hợp từ ba thành phần màu chính, đó là: Đỏ (Red), Xanh lá cây (Green), Xanh nước biển (Blue). Trong HTML một giá trị màu là một số nguyên dạng hexa (hệ đếm cơ số 16) có định dạng như sau: #RRGGBB trong đó: RR - là giá trị màu Đỏ. GG - là giá trị màu Xanh lá cây. BB - là giá trị màu Xanh nước biển. Màu sắc có thể được xác định qua thuộc tính bgcolor= hay color=. Sau dấu bằng có thể là giá trị RGB hay tên tiếng Anh của màu Bảng màu II. Các thẻ định dạng văn bản 2.3 Định dạng ký tự: Sau đây là các thẻ được sử dụng để quy định các thuộc tính như in nghiêng, in đậm, gạch chân... cho các ký tự, văn bản khi được thể hiện trên trình duyệt 2.3. Chọn kiểu chữ cho văn bản Cú pháp: III. Các thẻ định dạng danh sách 1. Danh sỏch cú trật tự Danh sỏch cú trật tự tự động đỏnh số từng thành tố của d/s. 2. Danh sỏch khụng cú trật tự Danh sỏch khụng  cú trật tự đỏnh dấu (chẳng hạn cỏc nỳm trũn) cho từng yếu tố của danh sỏch. 3. Danh sỏch định nghĩa Mỗi yếu tố của danh sỏch bao gồm hai thành phần:     Tiờu đề được căn lề phớa trỏi (chỉ ra bởi thẻ )     Phần giải nghĩa được căn lề thụt hơn sang phớa phải (chỉ ra bởi thẻ ) 4. Danh sỏch kiểu thực đơn Mỗi yếu tố của danh sỏch được cấp một chỉ số chẳng hạn như dấu trũn. Trụng rất giống danh sỏch khụng cú trật tự IV. Liên kết siêu văn bản Văn bản siêu liên kết hay còn gọi là siêu văn bản là một từ, một cụm từ hay một câu trên trang Web được dùng để liên kết tới một trang Web khác - URL được trình bày ở trên là URL tuyệt đối. - URL tương đối hay còn gọi là URL không đầy đủ. - Các thành phần trong URL được ngăn cách bằng ký tự ngăn cách (ký tự gạch chéo /). - Để tạo ra URL tương đối, đầu tiên phải sử dụng ký tự ngăn cách. - Nguyên tắc là các thành phần bên trái dấu ngăn cách của URL hiện tại được giữ nguyên, các thành phần bên phải được thay thế bằng thành phần URL tương đối. a. Địa chỉ tương đối b. Cách tạo liên kết siêu văn bản trong HTML Để tạo ra một siêu văn bản chúng ta sử dụng thẻ Cú pháp: ... siêu văn bản Vớ dụ: nhan vao day de kiem tra mail ý nghĩa các tham số: c. Cách tạo liên kết đến 1 địa chỉ mail Nếu đặt thuộc tính href= của thẻ giá trị mailto:address@domain thì khi kích hoạt kết nối sẽ kích hoạt chức năng thư điện tử của trình duyệt Vớ dụ: Trang WEB này được WEBMASTER bảo trì IV. Chèn các thẻ âm thanh, hình ảnh 5.1. Giới thiệu Liên kết với file đa phương tiện cũng tương tự như liên kết bình thường. Tuy vậy phải đặt tên đúng cho file đa phương tiện. Phần mở rộng của file phải cho biết kiểu của file 5.2. Đưa âm thanh vào một tài liệu HTML Cú pháp: Thẻ này không có thẻ kết thúc tương ứng (). Để chơi lặp lại vô hạn cần chỉ định LOOP = -1 hoặc LOOP = INFINITE. Thẻ BGSOUND phải được đặt trong phần mở đầu (tức là nằm trong cặp thẻ HEAD). 5.3. Chèn một hình ảnh, một đoạn video Để chèn một file ảnh (.jpg, .gif, .bmp) hoặc video (.mpg, .avi) vào tài liệu HTML, có thể sử dụng thẻ IMG Bài tập ụn tập Index.htm News.htm Product.htm contact.htm Đưa thụng tin vào 4 trang này. Cho phộp liờn kết giữa cỏc trang và cỏc website khỏc