Các phần tử về cụm từ

Các phần tử cụm từ được thiết kế cho những mục đích đặc biệt, mặc dù chúng được trình bày tương tự như các thẻ cơ bản khác như <b>, <i>, <pre>, và <tt>, mà bạn đã theo dõi trong các chương trước. Chương này sẽ giới thiệu cho bạn về các thẻ cụm từ quan trọng.

Nhấn mạnh văn bản trong HTML - Thẻ em trong HTML

Bất cứ nội dung nào trong phần tử <em>...</em> đều được hiển thị ở dạng văn bản được nhấn mạnh.

Ví dụ

<html>
    <head>
        <title>Nhan manh van ban trong HTML</title>
    </head>
    <body>
        <p>Vi dụ sau su dung the <em>em trong HTML</em>.</p>
    </body>
</html>

Kết quả hiển thị:

Đánh dấu văn bản trong HTML - The mark trong HTML

Nội dung xuất hiện trong phần tử <mark>...</mark> được hiển thị dưới dạng đánh dấu bằng màu mực vàng.

Ví dụ

<html>
    <head>
        <title>Danh dau van ban trong HTML</title>
    </head>
    <body>
        <p>Cum tu sau duoc danh dau bang <mark>the mark trong HTML</mark> voi mau vang</p>
    </body>
</html>

Kết quả hiển thị:

Thẻ strong trong HTML

Nội dung xuất hiện trong phần tử <strong>...</strong> được hiển thị như là văn bản quan trọng. Phần văn bản đó sẽ được in đậm hơn các phần văn bản khác.

Ví dụ

<html>
    <head>
        <title>Vi du the strong trong HTML</title>
    </head>
    <body>
        <p>Day la <strong>the strong </strong> trong HTML.</p>
    </body>
</html>

Kết quả hiển thị là:

Thẻ tóm tắt văn bản trong HTML - Thẻ abbr trong HTML

Bạn có thể rút gọn một văn bản bằng cách đặt nó vào trong thẻ mở <abbr> và thẻ đóng </abbr>. Sử dụng thẻ này bạn có thể cung cấp thêm thông tin hữu ích cho trình duyệt, hệ thống dịch thuật và tìm kiếm. Thuộc tính title được sử dụng trong thẻ để chỉ ra ý nghĩa đầy đủ của chữ/cụm từ viết tắt khi ta rê chuột qua thẻ này.

Ví dụ

<html>
    <head>
        <title>The abbr trong HTML</title>
    </head>
    <body>
        <p>Toi thich hoc <abbr title="Ngon ngu lap trinh Java">Java</abbr>.</p>
    </body>
</html>

Nó sẽ tạo ra kết quả sau:

Phần tử lược danh trong HTML - Thẻ acronym trong HTML

Phần tử <acronym> cho phép bạn chỉ rõ rằng văn bản trong thẻ <acronym></acronym> là một tên lược danh.

Hiện tại, các trình duyệt lớn không thay đổi sự hiển thị nội dung trong phần tử này.

Ví dụ

<html>
    <head>
        <title>Vi du the acronym trong HTML</title>
    </head>
    <body>
        <p>Ngoai HTML, ban co the hoc <acronym>XHTML</acronym>.</p>
    </body>
</html>

Hình ảnh hiển thị:

Phương hướng của văn bản trong HTML - Thẻ bdo trong HTML

Phần tử <bdo>...</bdo> là viết tắt của Bi-Directional Override, được sử dụng để quyết định phương hướng của văn bản hiện tại.

Ví dụ

<html>
    <head>
        <title>Vi du the bdo trong HTML</title>
    </head>
    <body>
        <p>Phan van ban se hien thi tu trai sang phai.</p>
        <p><bdo dir="rtl">Phan van ban se hien thi tu phai qua trai.</bdo></p>
    </body>
</html>

Nó sẽ tạo ra kết quả sau:

Hiển thị các mục đặc biệt - Thẻ dfn trong HTML

Phần tử <dfn>...</dfn> (hoặc phần tử định nghĩa HTML) cho phép bạn chỉ rõ rằng bạn đang giới thiệu một mục đặc biệt. Cách sử dụng của nó tương tự với cách làm in nghiêng từ trong giữa của đoạn văn.

Thông thường, bạn sử dụng phần tử này khi bạn lần đầu giới thiệu một mục quan trọng. Hầu hết các trình duyệt đều hiển thị nội dung trong phần tử này dưới dạng in nghiêng.

Ví dụ

<html>
    <head>
        <title>Vi du the dfn trong HTML</title>
    </head>
    <body>
        <p>HTML la mot khai niem <dfn>dac biet</dfn> trong tam tri toi.</p>
    </body>
</html>

Nó sẽ tạo ra kết quả sau:

Trích dẫn văn bản trong HTML - Thẻ blockquote trong HTML

Khi bạn muốn trích dẫn một đoạn văn từ nguồn khác, bạn nên đặt nó trong các thẻ <blockquote>...</blockquote>.

Văn bản trong phần tử này thường thụt lề phải và lề trái so với văn bản xung quanh, và đôi khi chúng ở dưới dạng in nghiêng.

Ví dụ

<html>
    <head>
        <title>Vi du the blockquote trong HTML</title>
    </head>
    <body>
        <p>Sau day la khai niem HTML la gi:</p>

        <blockquote>HTML là chữ viết tắt của <b>H</b>yper<b>t</b>ext <b>M</b>arkup <b>L</b>anguage, là ngôn ngữ được sử dụng rộng rãi nhất để viết các trang Web.</blockquote>
    </body>
</html>

Nó sẽ tạo ra kết quả sau:

Trích dẫn ngắn trong HTML - 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 trong dấu nháy kép vào trong một câu.

Ví dụ

<html>
    <head>
        <title>Vi du the q trong HTML</title>
    </head>
    <body>
        <p>Nhiều lần ngập ngừng muốn ngỏ ý, <q>Tiếng yêu đương sao chưa thành câu</q>.</p>
    </body>
</html>

Nó sẽ tạo ra kết quả là:

Câu trích dẫn trong HTML - The cite trong HTML

Nếu bạn đang trích dẫn một đoạn nào đó, bạn có thể chỉ rõ nguồn, đặt nó trong thẻ mở <cite> và thẻ đóng </cite>.

Khi bạn in, nội dung trong phần tử này được in nghiêng theo mặc định. Trong HTML 4.01, thẻ này định nghĩa một trích dẫn, còn trong HTML 5, thẻ này xác định tiêu đề một tác phẩm.

Ví dụ

<html>
    <head>
        <title>Vi du the cite trong HTML</title>
    </head>
    <body>
        <p>Bai huong dan HTML nay duoc dich tu <cite>trang Tutorialspoint</cite>.</p>
    </body>
</html>

Kết quả hiển thị của đoạn mã trên là:

Thẻ code trong HTML

Bất kỳ code chương trình nào xuất hiện trên trang Web đều được đặt trong phần tử <code>...</code>. Thông thường, nội dung trong phần tử này được hiển thị trong font đơn cách.

Ví dụ

<html>
    <head>
        <title>Vi du the code trong HTML</title>
    </head>
    <body>
        <p>Phan van ban nay duoc hien thi binh thuong. <code>Day la phan code.</code> Phan van ban nay duoc hien thi binh thuong.</p>
    </body>
</html>

Nó sẽ tạo ra kết quả sau:

Hiển thị văn bản nhập bàn phím trong HTML - Thẻ kbd trong HTML

Khi bạn đang nói về máy tính, nếu bạn muốn nói cho thiết bị đọc để nhập một vài văn bản, bạn có thể sử dụng phần tử <kbd>...</kbd> để chỉ rõ những gì nên được gõ vào, như trong ví dụ:

Ví dụ

<html>
    <head>
        <title>Vi du the kbd trong HTML</title>
    </head>
    <body>
        <p>Van ban binh thuong. <kbd>Van ban ben trong the kbd.</kbd> Van ban binh thuong.</p>
    </body>
</html>

Nó sẽ tạo ra kết quả là:

Hiển thị biến chương trình trong HTML - Thẻ var trong HTML

Phần tử này thường được sử dụng kết hợp với phần tử <pre><code> để chỉ rõ rằng nội dung trong phần tử là một biến.

Ví dụ

<html>
    <head>
        <title>Vi du the var trong HTML</title>
    </head>
    <body>
        <p><code>document.write("<var>user-name</var>")</code></p>
    </body>
</html>

Nó sẽ hiển thị kết quả:

Hiển thị kết quả chương trình trong HTML - Thẻ samp trong HTML

Phần tử <samp>...</samp> chỉ kết quả đầu ra mẫu của một chương trình. Nó hỗ trợ kiểu sample trong máy tính, và được sử dụng chính khi tài liệu lập trình hoặc mã hóa các khái niệm.

Ví dụ

<html>
    <head>
        <title>Vi du the samp trong HTML</title>
    </head>
    <body>
        <p>Ket qua cua chuong trinh la <samp>Hello World!</samp></p>
    </body>
</html>

Kết quả khi chạy đoạn code trên là:

Hiển thị địa chỉ trong HTML - Thẻ address trong HTML

Phần tử <address>...</address> dùng để chứa đựng bất cứ địa chỉ nào.

Ví dụ

<html>
    <head>
        <title>Vi du the address trong HTML</title>
    </head>
    <body>
        <address>So 11, Pho Le Thai To, Thu Do Ha Noi</address>
    </body>
</html>

Nó sẽ tạo ra kết quả sau:


Bình luận