Trang chủ
Sáu mức tiêu đề
Như là bạn đã nhìn thấy trong trang Web này, các phần tiêu đề ("Sáu mức tiêu đề", "Mục đích", "Mục Lục", ...) xuất hiện ở những kích cỡ khác nhau và, có lẽ ở cả những phông chữ và màu sắc khác nhau nữa. HTML cung cấp những đoạn mã cho việc thiết kế phần tiêu đề theo sáu mức độ khác nhau. Browser tự xác định chính xác phông chữ và kích cỡ để hiển thị.
Mục đích
Sau bài học này bạn có khả năng:- Nhận dạng được những mức độ khác nhau của các tiêu đề trong HTML và các tag liên quan tới chúng.
- Đặt những mức tiêu đề khác nhau vào trong tài liệu HTML và nhìn thấy sự thay đổi của chúng trong browser của bạn.
Bài học
Những tiêu đề của HTML
Những tiêu đề được thực hiện trong HTML bằng cách đặt đoạn văn bản giữa những tag tiêu đề (heading tag). Dạng các tag tiêu đề của HTML là:
<hN>Text to Appear in Heading</hN>
N là một số có giá trị từ 1 đến 6 chỉ định kích cỡ tiêu đề. Sau đây là một vài ví dụ cho
những kích cỡ khác nhau của tiêu đề :
Heading Level 1
Heading Level 2
Heading Level 3
Heading Level 4
Heading Level 5
Heading Level 6
Các mức độ tiêu đề được sắp xếp từ 1 (quan trọng nhất) đến 6 (ít quan trọng nhất). Các tiêu đề nên có tính tương đối, đánh số thứ tự và đặt tại các vị trí tương tự nhau.Đặt những tiêu đề HTML vào tài liệu của bạn
Lưu ý: Nếu bạn không có tài liệu từ bài học trước, bạn có thể download lại ngay bây giờ.- Mở lại workspace của bạn (nếu nó chưa được mở).
- Đến cửa sổ soạn thảo văn bản.
- Mở lại tập tin HTML đã tạo trong bài 2,
"Volc.htm". - Trước hết, chúng ta sử dụng tag <h1> để trình bày tiêu đề như là header lớn
nhất, <H1>. Nhâp dòng sau vào phần thân của HTML và sau
các tag </head><body>:
<h1>Volcano Web</h1> - Bên dưới những dòng văn bản đã nhập, tạo những đề mục khác nhau cho những phần
sau này của trang Volcano Web của bạn.
Nhập những tiêu đề sau trong phần thân của trang Web của bạn (chú ý một số sử dụng
</h3> còn một số sử dụng </h2>):
<h2>Introduction</h2> <h2>Volcano Terminology</h2> <h2>Volcanic Places in the USA</h2> <h3>Mount St Helens</h3> <h3>Long Valley</h3> <h2>Volcanic Places on Mars?</h2> <h2>Research Project</h2> <h3>References</h3> - Lưu trữ (save) lại sự thay đổi trong trình soạn thảo.
- Trở lại web browser của bạn, Mở và Nạp lại tập tin HTML.
Chú ý rằng trên máy tính bạn đang sử dụng hiện nay, bạn có thể cài đặt cho browser của bạn phông và/hay kích thước của các tiêu đề. Ví dụ như, bạn có thể có một browser thể hiện tag h1 theo phông Times có 36 điểm; tag h2 theo phông Helvetica có 24 điểm, v.v... Các mã HTML chỉ đưa ra các loại của tiêu đề (từ h1 đến h6); còn việc thể hiện chúng thì được điều khiển bởi người sử dụng thông qua trình web browser.
Kiểm tra công việc của bạn
So sánh công việc của bạn với ví dụ mẫu sẵn có. Nếu có một vài tiêu đề xuất hiện không đúng, hãy kiểm tra lại tag bắt đầu và tag kết thúc của mỗi tiêu đề. Như là một phần bài tập đề nghị, hãy nhìn xem chuyện gì sẽ xảy ra khi bạn có một lỗi đánh máy sai. Mở lại tài liệu HTML của bạn trong chương trình soạn thảo và xoá đi ký tự "/" trong tag kết thúc <h1> , sau đề mục Volcano Web:
<h1>Volcano Web<h1>
[missing "/" -----------^^^]
Lưu trữ sự thay đổi và nạp lại trong Web browser. Không có sự kết thúc đúng đắn của tag
h1, browser của bạn sẽ thông dịch phần văn bản tiếp theo như là một phần của tiêu đề!
Sau khi thử xong bạn nên trở lại tài liệu của bạn và thêm lại dấy / như ban đầu.
Xem lại
- Những mức độ khác nhau của tiêu đề trong HTML là gì?
- Những tag liên quan đến những mức độ này là gì?
- Những bước nào được sử dụng trong việc đặt tiêu đề vào trong tài liệu HTML ?
- Những gì xảy ra nếu bạn quên dấu "/" tại cuối của một tag tiêu đề?
