Thẻ cụm từ trong HTML
Các thẻ cụm từ đã được thiết kế cho các mục đích cụ thể, mặc dù chúng được hiển thị theo cách tương tự như các thẻ cơ bản khác như <b>, <i>, <pre> và <tt> mà bạn đã thấy trong chương trước.
Chương này sẽ trình bày tất cả các thẻ cụm từ quan trọng, chúng ta sẽ lần lượt xem qua từng thẻ cụm từ trong HTML nhé.
Thẻ em trong HTML
Bất cứ điều gì xuất hiện trong phần tử <em> ... </ em> đều được hiển thị dưới dạng văn bản được nhấn mạnh.
Ví dụ sử dụng thẻ em trong HTML:
<!DOCTYPE html>
<html>
<head>
<title>Emphasized Text Example</title>
</head>
<body>
<p>The following word uses an <em>emphasized</em> typeface.</p>
</body>
</html>Điều này sẽ tạo ra kết quả sau:
Thẻ mark trong HTML
Bất cứ điều gì xuất hiện trong phần tử <mark> ... </ mark> sẽ được hiển thị dưới dạng được đánh dấu bằng mực màu vàng.
Ví dụ sử dụng thẻ mark trong HTML:
<!DOCTYPE html>
<html>
<head>
<title>Marked Text Example</title>
</head>
<body>
<p>The following word has been <mark>marked</mark> with yellow</p>
</body>
</html>Điều này sẽ tạo ra kết quả sau
Thẻ strong trong HTML
Bất cứ điều gì xuất hiện trong phần tử <strong> ... </ strong> đều được hiển thị dưới dạng văn bản quan trọng.
Ví dụ sử dụng thẻ strong trong HTML:
<!DOCTYPE html>
<html>
<head>
<title>Strong Text Example</title>
</head>
<body>
<p>The following word uses a <strong>strong</strong> typeface.</p>
</body>
</html>Điều này sẽ tạo ra kết quả sau
Thẻ abbr trong HTML
Bạn có thể viết tắt một văn bản bằng cách đặt nó vào trong việc mở các thẻ <abbr> ... </ abbr>. Nếu sử dụng thẻ này, thuộc tính title phải chứa mô tả đầy đủ cho nội dung của thẻ này và không có ngoại lệ.
Ví dụ minh họa sử dụng thẻ abbr trong HTML:
<!DOCTYPE html>
<html>
<head>
<title>Text Abbreviation</title>
</head>
<body>
<p>My best friend's name is <abbr title = "Abhishek">Abhy</abbr>.</p>
</body>
</html>Điều này sẽ tạo ra kết quả sau:
Thẻ acronym trong HTML
Phần tử <acronym> cho phép bạn chỉ ra rằng văn bản giữa các thẻ <acronym> ... </ acronym> là từ viết tắt.
Hiện tại, các trình duyệt chính không thay đổi cách hiển thị của nội dung trong phần tử <acronym>.
Ví dụ minh họa sử dụng thẻ acronym trong HTML:
<!DOCTYPE html>
<html>
<head>
<title>Acronym Example</title>
</head>
<body>
<p>This chapter covers marking up text in <acronym>XHTML</acronym>.</p>
</body>
</html>Điều này sẽ tạo ra kết quả sau:
Thẻ bdo trong HTML
Phần tử <bdo> … </ bdo> là viết tắt của Bi-Directional Override và được sử dụng để ghi đè hướng văn bản hiện tại.
Ví dụ minh họa sử dụng thẻ bdo trong HTML:
<!DOCTYPE html>
<html>
<head>
<title>Text Direction Example</title>
</head>
<body>
<p>This text will go left to right.</p>
<p><bdo dir = "rtl">This text will go right to left.</bdo></p>
</body>
</html>Điều này sẽ tạo ra kết quả sau
Thẻ dfn trong HTML
Phần tử <dfn> ... </ dfn>cho phép bạn chỉ định rằng bạn đang giới thiệu một thuật ngữ đặc biệt. Cách sử dụng của nó tương tự như các từ in nghiêng ở giữa đoạn văn.
Thông thường, bạn sẽ sử dụng phần tử <dfn> trong lần đầu tiên bạn giới thiệu một thuật ngữ chính. Hầu hết các trình duyệt gần đây hiển thị nội dung của phần tử <dfn> bằng phông chữ in nghiêng.
Ví dụ minh họa sử dụng thẻ dfn trong HTML:
<!DOCTYPE html>
<html>
<head>
<title>Special Terms Example</title>
</head>
<body>
<p>The following word is a <dfn>special</dfn> term.</p>
</body>
</html>Điều này sẽ tạo ra kết quả sau
Thẻ blockquote trong HTML
Khi bạn muốn trích dẫn một đoạn văn từ một nguồn khác, bạn nên đặt nó ở giữa các thẻ <blockquote> ... </ blockquote>.
Văn bản bên trong phần tử <blockquote> thường được thụt vào từ cạnh trái và phải của văn bản xung quanh và đôi khi sử dụng phông chữ in nghiêng.
Ví dụ minh họa sử dụng thẻ blockquote trong HTML:
<!DOCTYPE html>
<html>
<head>
<title>Blockquote Example</title>
</head>
<body>
<p>The following description of XHTML is taken from the W3C Web site:</p>
<blockquote>XHTML 1.0 is the W3C's first Recommendation for XHTML,following on
from earlier work on HTML 4.01, HTML 4.0, HTML 3.2 and HTML 2.0.</blockquote>
</body>
</html>Điều này sẽ tạo ra kết quả sau
Thẻ q trong HTML
Phần tử <q> ... </q> được sử dụng khi bạn muốn thêm một trích dẫn kép trong câu.
Ví dụ minh họa sử dụng thẻ q trong HTML:
<!DOCTYPE html>
<html>
<head>
<title>Double Quote Example</title>
</head>
<body>
<p>Amit is in Spain, <q>I think I am wrong</q>.</p>
</body>
</html>Điều này sẽ tạo ra kết quả sau
Thẻ cite trong HTML
Nếu bạn đang trích dẫn một văn bản, bạn có thể chỉ ra nguồn đặt nó giữa phần tử <cite> ... </cite>.
Nội dung của phần tử <cite> được hiển thị trong văn bản in nghiêng theo mặc định.
Ví dụ minh họa sử dụng thẻ cite trong HTML:
<!DOCTYPE html>
<html>
<head>
<title>Citations Example</title>
</head>
<body>
<p>This HTML tutorial is derived from <cite>W3 Standard for HTML</cite>.</p>
</body>
</html>Điều này sẽ tạo ra kết quả sau
Thẻ code trong HTML
Bất kỳ mã lập trình nào xuất hiện trên trang Web phải được đặt bên trong các thẻ <code> ... </code>. Thông thường nội dung của phần tử <code> được trình bày theo phông chữ đơn cách, giống như mã trong hầu hết các ngôn ngữ lập trình.
Ví dụ minh họa sử dụng thẻ code trong HTML:
<!DOCTYPE html>
<html>
<head>
<title>Computer Code Example</title>
</head>
<body>
<p>Regular text. <code>This is code.</code> Regular text.</p>
</body>
</html>Điều này sẽ tạo ra kết quả sau
Thẻ kbd trong HTML
Khi bạn đang nói về máy tính, nếu bạn muốn nói với người đọc nhập một số văn bản, bạn có thể sử dụng phần tử <kbd> … </ kbd> để chỉ ra những gì nên nhập vào, như trong ví dụ này.
Ví dụ minh họa sử dụng thẻ kbd trong HTML:
<!DOCTYPE html>
<html>
<head>
<title>Keyboard Text Example</title>
</head>
<body>
<p>Regular text. <kbd>This is inside kbd element</kbd> Regular text.</p>
</body>
</html>Điều này sẽ tạo ra kết quả sau:
Thẻ var trong HTML
Phần tử này thường được sử dụng cùng với các phần tử <pre> và <code> để chỉ ra rằng nội dung của phần tử đó là một biến.
Ví dụ minh họa sử dụng thẻ var trong HTML:
<!DOCTYPE html>
<html>
<head>
<title>Variable Text Example</title>
</head>
<body>
<p><code>document.write("<var>user-name</var>")</code></p>
</body>
</html>Điều này sẽ tạo ra kết quả sau
Thẻ samp trong HTML
Phần tử <samp> ... </ samp> biểu thị đầu ra mẫu từ một chương trình và tập lệnh, v.v. Một lần nữa, nó chủ yếu được sử dụng khi ghi lại các khái niệm lập trình hoặc mã hóa.
Ví dụ minh họa sử dụng thẻ samp trong HTML:
<!DOCTYPE html>
<html>
<head>
<title>Program Output Example</title>
</head>
<body>
<p>Result produced by the program is <samp>Hello World!</samp></p>
</body>
</html>Điều này sẽ tạo ra kết quả sau
Thẻ address trong HTML
Phần tử <address> ... </ address> được sử dụng để chứa bất kỳ địa chỉ nào.
Ví dụ minh họa sử dụng thẻ address trong HTML:
<!DOCTYPE html>
<html>
<head>
<title>Address Example</title>
</head>
<body>
<address>388A, Road No 22, Jubilee Hills - Hyderabad</address>
</body>
</html>Điều này sẽ tạo ra kết quả sau
