HTML cơ bản - Phần 6

Làm việc với các kiểu mẫu (Style)

Giống như một trình soạn thảo văn bản, HTML có thể báo cho Web browser hiển thị một phần nào đó của văn bản ở dạng in nghiêng hoặc in đậm hoặc ở dạng in kết hợp cả hai chế độ.

Mục đích

Sau bài học này bạn có khả năng:

• Nhận dạng các tag HTML cho các kiểu mẫu văn bản: Đậm, nghiêng, hoặc ở dạng chữ đánh máy (mono-spaced).
• Nhập văn bản trong tài liệu HTML theo nhiều kiểu mẫu khác nhau và nhìn thấy sự thay đổi của chúng trong Web browser của bạn.

---

Bài học

Các tag Style của HTML

HTML cung cấp một vài tag cho việc định dạng style cho văn bản. Hãy thận trọng và suy nghĩ cẩn thận trước khi dùng những kiểu này để định dạng cho văn bản; sử dụng quá nhiều có thể làm cho văn bản trở nên khó đọc hơn ...

Các tag Style
HTML	Kết quả
<b>This is Bold...</b>	This is Bold
<i>This is Italic...</i>	This is Italic
<tt>This is Typewriter...</tt>	This is Typewriter
Lưu ý rằng bạn có thể kết hợp các tag này để định dạng miễn là chúng được lồng vào nhau một cách chính xác, ví dụ như cả hai tag bắt đầu và kết thúc in nghiêng đều phải ở bên trong các tag in đậm. Cũng lưu ý là thứ tự các tag không quan trọng.
<i><b>This is Bold AND Italic</b></i> <b><i>And So is This</i></b>	This is Bold AND Italic And So is This
Hơn nữa, bạn có thể áp dụng những kiểu vào trong phần tiêu đề. Lưu ý về cách đặt các tag style đóng và mở xung quanh những từ muốn tạo kiểu còn những tag đề mục thì bao quanh toàn bộ đề mục.
blah blah blah <h2><i>New</i> and <tt>Improved!</tt></h2> blah blah blah	blah blah blah New and Improved! blah blah blah

Áp dụng Style vào trong tài liệu của bạn

Lưu ý: Nếu bạn chưa có tài liệu từ các bài học trước, bạn có thể download ngay bây giờ. Theo những bước sau để áp dụng các tag style cho văn bản HTML của bạn:

1. Mở lại workspace của bạn (nếu nó chưa được mở).
2. Trở lại tài liệu HTML "Volc.htm" của bạn trong chương trình soạn thảo.
3. Tìm từ "volcano" trong câu đầu tiên của phần Introduction. Chúng ta sẽ làm từ này trở nên in đậm để đánh dấu đây là từ quan trọng.
4. Chèn thêm các tag để làm từ này trở nên in đậm :

   
             <b>volcano</b>

5. Bây giờ chúng ta sẽ sửa đổi đoạn văn thứ hai với những tag in đậm và in ngiêng để nhấn mạnh. Hãy thêm tag <b>...</b> và <i>...</i> quanh từ billion đó để đoạn này trông giống như sau :

   
             <p>
             Volcanoes have been a part of earth's history long 
             before humans. Compare the history of human beings, 
             a few million years in the making, to that of the
             Earth, over four <b><i>billion</i></b> years in the
             making.

6. Cuối cùng, chúng ta sẽ sử dụng tag typewriter để chỉ ra một từ đặc biệt. Bên dưới đề mục Volcano Terminology, nhập vào đoạn sau:

   
             The study of volcanoes, or <tt>Volcanology</tt>,
             includes many odd terms.

7. Lưu trữ trong trình soạn thảo và Reload trong Web browser của bạn.

---

Kiểm tra lại công việc của bạn

Hãy xem Ví dụ mẫu để nhìn thấy sự thay đổi. Điều quan trọng khi sử dụng các tag style là sự kết thúc đúng đắn các tag này bằng tag </> thích hợp. Nếu không, tất cả phần văn bản còn lại sẽ bị tác động của kiểu đã chọn. Khi nhìn sẽ có vẻ kỳ quặc.

Xem lại

1. Các tag style của HTML là gì?
2. Những tag nào được sử dụng cho việc định dạng các kiểu mẫu văn bản?
3. Những bước nào bạn sử dụng cho việc áp dụng kiểu vào trong tài liệu HTML ?
4. Điểm thêm*- Các tag này tạo ra tiện lợi khi tạo trang web như thế nào?

Thực tập tự do

Thử sử dụng các tag style để làm đậm, làm nghiêng, và dùng kiểu chữ đánh máy typewriter vào văn bản trong trang web của bạn. Hãy quan sát khi bạn có thể sử dụng thành công tổ hợp các kiểu mẫu.

---

Đi đến phần tiếp theo....

Làm thế nào để đặt một danh sách các mục (list of items) lại với nhau, thể hiện chúng ở cả dạng số (numbered fashion) và dạng dấu chấm (bulleted fashion).