Bài giảng HTML ngôn ngữ đánh dấu siêu văn bản Trịnh Công Duy Chia sẻ: rklonely | Ngày: 05082014 Cùng nắm kiến thức trong bài giảng HTML ngôn ngữ đánh dấu siêu văn bản thông qua việc tìm hiểu các nội dúng sau: các thẻ định cấu trúc tài liệu, các thẻ định dạng văn bản, các thẻ định dạng danh sách, liên kết siêu văn bản, chèn các thẻ âm thanh, hình ảnh.
Trang 2Khá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:
<TAG>văn bản chịu tác động</TAG>
- Tập tin HTML luôn bắt đầu bằng thẻ <HTML> và kết thúc bằng </HTML>
- 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
Trang 3Tổ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
Trang 4Cấu trúc căn bản của trang web
Trang 5I Các thẻ định cấu trúc tài liệu
Trang 6Ph n ầ đầ u
</HEAD>
Trang 71.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:
<BODY>
phần nội dung của tài liệu được đặt ở đây
</BODY>
Trang 8C¸c tham sè cña thÎ BODY
Trang 10Cộng hoà xã hội chủ nghĩa Việt nam<BR> Độc lập - Tự do - Hạnh
phúc<P>Đơn xin việc
Trang 112.3 §êng kÎ ngang
một trang Web thành những phần có tính logic và dễ nhìn
Trang 12II Các thẻ định dạng văn bản
2.1 Thẻ <DIV> </DIV>…
• 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: <DIV align =thuộc tính > </DIV>…
RIGHT JUSTIFY LEFT
CENTER
Trang 132.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:
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
Trang 14YELLOW LIGHTYELLOW WHITE
BLACK GRAY BROWN MAGENTA VIOLET PINK ORANGE NAVY
Trang 15II 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
<SUP> </SUP> Chỉ số trên (SuperScript)
<SUB> </SUB> Chỉ số dưới (SubScript)
Trang 18Chú giải cho yếu tố 2
3 Danh sách định nghĩa
Tiêu đề được căn lề phía trái (chỉ ra bởi thẻ <DT>)
Phần giải nghĩa được căn lề thụt hơn sang phía phải
(chỉ ra bởi thẻ <DD>)
Trang 194 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ự
Trang 20IV 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
http://selab.vnuh.edu.vn:8080 /~dir1/dir2/dir3/index.HTML#chapter001
Dịch vụ
Tên hệ thống
Cổng
Đường dẫn
Tên file
Các tham
số, biến,
Trang 21- 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 đủ
a Địa chỉ tương đối
Trang 22b C¸ch t¹o liªn kÕt siªu v¨n b¶n trong HTML
nhan <a href="http://mail.yahoo.com">vao day</a>
de kiem tra mail
Trang 23ý nghÜa c¸c tham sè:
HREF Địa chỉ của trang Web được liên
kết, là một URL nào đó
NAME Đặt tên cho vị trí đặt thẻ
Tab
siêu liên kết
một cửa sổ mới (_blank) hoặc trong cửa sổ hiện tại (_self)
Trang 24c Cách tạo liên kết ến 1 địa chỉ mail đ
Nếu đặt thuộc tính href= của thẻ <a> giá trị
hoạt chức năng thư điện tử của trình duyệt
Trang 25IV Chèn các thẻ âm thanh, hình ảnh
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:
INFINITE Thẻ BGSOUND phải được đặt trong phần mở đầu
(tức là nằm trong cặp thẻ HEAD).
<BGSOUND
SRC = url LOOP = n
>
Trang 265.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
<IMG VALIGN = TOP/MIDDLE/BOTTOM
>
Trang 27ALIGN = TOP/ MIDDLE/
BOTTOM/ LEFT/ RIGHT Căn hàng văn bản bao quanh
ALT = text Nội dung hiển thị khi ảnh không hiển thị
BORDER = n Kích thước đường viền
SRC = url Địa chỉ file ảnh cần đưa vào tài liệu
WIDTH/HEIGHT Kích thước ảnh đưa vào.
HSPACE/VSPACE Chỉ định khoảng trống quanh ảnh
TITLE = title Nội dung hiển thị khi đưa chuột qua
DYNSRC = url Địa chỉ file Video.
START =
FILEOPEN/MOUSEOVER Chỉ định file Video chơi khi mở file hay khi nhấn chuột (có thể kết hợp bằng dấu ,).
LOOP = n/INFINITE Chỉ định số lần chơi (n) hay chơi vô hạn.
Trang 28– Đư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
