12_Lesson8.kntt

​Định dạng văn bản

​Định dạng văn bản

​1. Thuộc tính thẻ

-Mọi phần tử HTML đều có thể có thuộc tính. 

-Thuộc tính có tác dụng bổ sung thông tin, làm rõ điều khiển được thẻ chỉ định.




-Một thẻ có thể có nhiều thuộc tính ngăn cách nhau bởi dấu cách.

​Định dạng văn bản

​1. Thuộc tính thẻ

-Mọi phần tử HTML đều có thể có thuộc tính. 

-Thuộc tính có tác dụng bổ sung thông tin, làm rõ điều khiển được thẻ chỉ định.
-Một thẻ có thể có nhiều thuộc tính ngăn cách nhau bởi dấu cách.
-Thuộc tính được đặt trong thẻ mở, sau tên thẻ.

-Thuộc tính thường dùng là style có tác dụng thiết lập định dạng văn bản như màu sắc, kiểu chữ,...

​Định dạng văn bản

​1. Thuộc tính thẻ

Các Thuộc tính Phổ Biến:

• style: Được sử dụng để áp dụng các kiểu dáng cho một phần tử như màu sắc, kích thước chữ, căn lề, v.v.

• id và class: Được sử dụng để xác định phần tử, cho phép gán kiểu hoặc áp dụng JavaScript.

• src: Được sử dụng với thẻ <img> để chỉ định đường dẫn đến hình ảnh.

• href: Được sử dụng trong thẻ <a> để chỉ định liên kết.

Multiple Choice

Phương án nào sau đây chỉ ra đúng vị trí đặt thuộc tính?

• Nằm sau thẻ mở, trước nội dung.

• Nằm sau nội dung, trước thẻ đóng.

• Nằm trong thẻ mở, sau tên thẻ.

• Nằm trong thẻ đóng, sau tên thẻ.

Multiple Choice

Đâu là cách viết đúng khi sử dụng thuộc tính style để thay đổi màu chữ thành màu xanh?

• <p color="blue">Nội dung</p>

• <p >Nội dung</p>

• <p >Nội dung</p>

• <p color->Nội dung</p>

Multiple Choice

Thuộc tính src thường được sử dụng cho thẻ HTML nào?

• <a>

• <img>

• <p>

• <div>

Multiple Choice

Trong HTML, các thuộc tính của một thẻ được ngăn cách với nhau bằng gì?

• Dấu cách

• Dấu hai chấm

• Dấu phẩy

• Dấu chấm

Multiple Choice

Thuộc tính href trong thẻ <a> có chức năng gì?

• Định dạng kích thước văn bản

• Thêm hình ảnh vào tài liệu

• Xác định đường dẫn liên kết

• Đặt kiểu dáng cho văn bản

Multiple Choice

Tại sao thuộc tính style thường được sử dụng trong HTML?

• Để tạo liên kết đến các trang khác

• Để thay đổi hoặc định dạng kiểu dáng của phần tử

• Để chèn hình ảnh vào trang web

• Để kiểm tra lỗi trong mã HTML

Multiple Choice

Khi nào nên sử dụng thuộc tính alt trong thẻ <img>?

• Khi muốn thay đổi kích thước ảnh

• Khi muốn mô tả nội dung của ảnh cho trình đọc màn hình hoặc khi ảnh không hiển thị

• Khi muốn chỉ định liên kết cho ảnh

• Khi muốn đặt màu nền cho ảnh

Multiple Choice

Thuộc tính class giúp ích gì trong việc thiết kế và phát triển trang web?

• Đặt tên duy nhất cho phần tử HTML

• Xác định đường dẫn của hình ảnh

• Liên kết các phần tử HTML với nhau

• Nhóm các phần tử HTML để có thể áp dụng cùng một kiểu dáng hoặc chức năng

Multiple Choice

Sự khác biệt giữa thuộc tính id và class là gì?

• id chỉ dùng cho thẻ <div>, còn class cho tất cả các thẻ khác

• id là duy nhất cho mỗi phần tử trên trang, còn class có thể dùng cho nhiều phần tử

• id có thể dùng nhiều lần trên một trang, còn class chỉ dùng một lần

• id được sử dụng để liên kết hình ảnh, còn class là để thêm kiểu dáng

​Định dạng văn bản

2. Các thẻ định dạng
a. Định dạng tiêu đề

• Các thẻ tiêu đề được sử dụng để tạo các cấp độ tiêu đề từ lớn đến nhỏ, từ <h1> đến <h6>.

• Cú pháp: <hx>Tiêu đề</hx> với x là số từ 1 đến 6.

  • <h1> là cấp cao nhất, thường được dùng cho tiêu đề chính.

  • <h6> là cấp thấp nhất, thường dùng cho các tiêu đề phụ nhỏ.

• Tác dụng: Các thẻ tiêu đề giúp xác định cấu trúc nội dung và cải thiện khả năng đọc hiểu của người dùng.

​Định dạng văn bản

2. Các thẻ định dạng
b. Định dạng văn bản

• Thẻ <p> được sử dụng để xác định các đoạn văn bản.

  • Nội dung đoạn văn cần hiển thị được đặt giữa cặp thẻ <p>...</p>.

  • Mỗi đoạn văn bắt đầu trên dòng mới và thường có khoảng trống trước và sau.

  • Đoạn văn không nên chứa tiêu đề hoặc các phần tử không liên quan.

​

• Thẻ <div>: Được sử dụng để tạo một khối chứa nội dung, bắt đầu trên dòng mới, thường được dùng để nhóm các phần tử lại với nhau và áp dụng kiểu dáng CSS.

• Thẻ <span>: Tạo một khối chứa nội dung trong cùng dòng, thích hợp để định dạng một phần nhỏ của nội dung, chẳng hạn một từ hay một cụm từ.

Multiple Choice

Thẻ tiêu đề nào trong HTML có kích thước lớn nhất?

• <h1>

• <h3>

• <h5>

• <h6>

Multiple Choice

Thẻ nào dùng để xác định một đoạn văn bản trong HTML?

• <div>

• <span>

• <p>

• <h2>

Multiple Choice

Thẻ <div> có đặc điểm gì?

• Bắt đầu trên dòng mới và dùng để nhóm các phần tử

• Hiển thị nội dung trên cùng dòng đang viết

• Được dùng để xác định đoạn văn

• Chỉ được sử dụng trong tiêu đề

Multiple Choice

Có bao nhiêu cấp độ tiêu đề trong HTML?

• 2

• 7

• 4

• 6

Multiple Choice

Thẻ <span> có tác dụng gì trong HTML?

• Tạo tiêu đề cho nội dung

• Xác định một đoạn văn bản

• Định dạng văn bản trên cùng một dòng

• Tạo một khối chứa nội dung bắt đầu trên dòng mới

Multiple Choice

Tại sao cần sử dụng các thẻ tiêu đề (<h1>, <h2>,... <h6>) để cấu trúc nội dung trang web?

• Để tạo cấu trúc rõ ràng, dễ hiểu cho người đọc

• Để làm đẹp giao diện trang web

• Để giúp trình duyệt hiển thị nội dung đúng định dạng

• Để tăng tốc độ tải trang

Multiple Choice

Thẻ <div> và <span> khác nhau như thế nào trong cách chúng hiển thị nội dung?

• <div> hiển thị nội dung trên cùng dòng, <span> trên dòng mới

• <div> bắt đầu trên dòng mới, còn <span> giữ nội dung trên cùng dòng

• <div> chỉ được dùng trong văn bản, <span> chỉ dùng cho hình ảnh

• <div> và <span> hiển thị nội dung hoàn toàn giống nhau

Multiple Choice

Khi nào bạn nên sử dụng thẻ <p> thay vì thẻ <div> để chứa nội dung?

• Khi muốn tạo khối nội dung lớn

• Khi muốn nhóm nhiều phần tử lại với nhau

• Khi cần hiển thị đoạn văn bản và có khoảng cách trước sau đoạn

• Khi muốn nội dung nằm trên cùng dòng

Multiple Choice

Thẻ <span> thường được sử dụng trong trường hợp nào?

• Để nhóm toàn bộ nội dung của trang web

• Để định dạng một phần nhỏ của văn bản, như một từ hoặc cụm từ trong đoạn văn

• Để tạo tiêu đề cho trang web

• Để chia trang thành nhiều phần khác nhau

Multiple Choice

Vì sao cần sử dụng các cấp độ tiêu đề <h1> đến <h6> thay vì chỉ dùng một loại thẻ tiêu đề?

• Để thay đổi màu sắc của tiêu đề dễ dàng hơn

• Để giảm kích thước mã HTML

• Để tăng độ phức tạp của trang web

• Để tạo sự khác biệt về kích thước và cấu trúc nội dung, giúp người đọc dễ hiểu

​Định dạng văn bản

3. Các thẻ định dạng phông chữ

a. Định dạng kiểu chữ

HTML5 không hỗ trợ thẻ <big> và <u>. Dưới đây là một số thẻ định dạng kiểu chữ.

​Định dạng văn bản

3. Các thẻ định dạng phông chữ

b. Định dạng phông chữ

Sử dụng thuộc tính style để định dạng thuộc tính màu sắc, phông chữ,...

• Màu sắc: <p style="color:màu">Nội dung</p>

• Phông chữ: <p style="font-family:tên phông">Nội dung</p>

• Cỡ chữ: <p style="font-size:cỡ">Nội dung</p>

Sử dụng các cặp tên:giá trị được ngăn cách nhau bởi dấu ";".

Multiple Choice

Một ví dụ về cách viết phần giá trị đúng là

• red:color

• color.red

• color;red

• color:red

Multiple Choice

Thẻ nào được dùng để làm cho văn bản in đậm trong HTML?

• Sử dụng thẻ <strong> hoặc <b>

• Sử dụng thẻ <i> hoặc <u>

• Sử dụng thẻ <em> hoặc <mark>

• Sử dụng thẻ <sup> hoặc <sub>

Multiple Choice

Thẻ <mark> trong HTML có tác dụng gì?

• Làm đậm nội dung văn bản

• Đánh dấu làm nổi bật văn bản

• Định dạng văn bản in nghiêng

• Thay đổi màu sắc văn bản

Multiple Choice

Thẻ nào trong HTML dùng để gạch ngang văn bản?

• Thẻ <u> để gạch ngang văn bản

• Thẻ <sub> để gạch ngang văn bản

• Thẻ <del> để gạch ngang văn bản

• Thẻ <mark> để gạch ngang văn bản

Multiple Choice

Thuộc tính nào dùng để thay đổi màu sắc văn bản trong thẻ <p>?

• Thuộc tính color trong thẻ <p>

• Thuộc tính font trong thẻ <p>

• Thuộc tính mark trong thẻ <p>

• Thuộc tính size trong thẻ <p>

Multiple Choice

Thẻ nào giúp giảm kích thước văn bản so với cỡ chữ mặc định?

• Sử dụng thẻ <del> để giảm kích thước

• Sử dụng thẻ <small> để giảm kích thước

• Sử dụng thẻ <sup> để giảm kích thước

• Sử dụng thẻ <b> để giảm kích thước

Multiple Choice

Khi nào bạn nên sử dụng thẻ <strong> thay vì thẻ <b> trong HTML?

• Khi bạn muốn làm đậm văn bản mà không cần nhấn mạnh ý nghĩa

• Khi bạn muốn làm đậm văn bản và nhấn mạnh ý nghĩa của nó

• Khi bạn chỉ muốn thay đổi màu sắc của văn bản

• Khi bạn muốn làm văn bản in nghiêng mà không cần định dạng khác

Multiple Choice

Thẻ <em> trong HTML có gì khác biệt so với thẻ <i>?

• Thẻ <em> làm văn bản in nghiêng, còn thẻ <i> không thay đổi kiểu chữ

• Thẻ <em> không thay đổi kiểu chữ, còn thẻ <i> làm chữ đậm

• Thẻ <em> nhấn mạnh văn bản, còn thẻ <i> chỉ thay đổi kiểu chữ mà không có tác dụng ngữ nghĩa

• Thẻ <em> dùng để làm chữ nhỏ hơn, còn thẻ <i> chỉ thay đổi màu chữ

Multiple Choice

Khi nào nên sử dụng thẻ <mark> trong HTML?

• Khi bạn muốn thay đổi kích thước của văn bản

• Khi bạn muốn đánh dấu và làm nổi bật một phần văn bản

• Khi bạn muốn tạo tiêu đề cho văn bản

• Khi bạn muốn giảm kích thước chữ trong đoạn văn

Multiple Choice

Thẻ <sup> trong HTML có tác dụng gì?

• Tạo chữ nhỏ hơn và nằm dưới dòng văn bản

• Tạo chữ nhỏ hơn và nằm trên dòng văn bản

• Đánh dấu một phần văn bản cần chú ý

• Làm cho văn bản in nghiêng và nhấn mạnh

Multiple Choice

Để thay đổi phông chữ trong HTML, bạn cần sử dụng thuộc tính nào trong thẻ <p>?

• Thuộc tính font-family để chỉ định phông chữ

• Thuộc tính font-size để thay đổi kích thước chữ

• Thuộc tính color để thay đổi màu sắc chữ

• Thuộc tính text-align để căn chỉnh văn bản

​Định dạng văn bản

​LUYỆN TẬP

Multiple Choice

Để tạo một tiêu đề phụ trong bài viết nằm dưới tiêu đề chính, bạn nên sử dụng thẻ nào?

• Dùng thẻ <h1> cho tiêu đề phụ

• Dùng thẻ <h2> cho tiêu đề phụ

• Dùng thẻ <h3> cho tiêu đề phụ

• Dùng thẻ <h6> cho tiêu đề phụ

Multiple Choice

Nếu muốn nhóm các phần tử HTML lại để áp dụng chung một kiểu CSS mà không thay đổi cấu trúc dòng, bạn nên sử dụng thẻ nào?

• Sử dụng thẻ <div> cho nhóm này

• Sử dụng thẻ <p> cho nhóm này

• Sử dụng thẻ <span> cho nhóm này

• Sử dụng thẻ <h4> cho nhóm này

Multiple Choice

Khi cần tạo một phần nội dung lớn có nhiều đoạn văn, cách tốt nhất để bố cục và định dạng là gì?

• Đặt nội dung trong các thẻ <div> riêng

• Đặt nội dung trong một thẻ <h1>

• Đặt nội dung trong các thẻ <span> riêng

• Đặt nội dung trong các thẻ <p> riêng

Multiple Choice

Nếu muốn thay đổi màu sắc cho một từ duy nhất trong câu, cách nào là hợp lý nhất?

• Dùng thẻ <div> để đổi màu từ đó

• Dùng thẻ <p> để đổi màu từ đó

• Dùng thẻ <span> để đổi màu từ đó

• Dùng thẻ <h3> để đổi màu từ đó

Multiple Choice

Để nhóm các phần tử trên một trang web mà không ảnh hưởng đến vị trí của các phần tử khác, bạn nên sử dụng thẻ nào?

• Sử dụng thẻ <span> để nhóm các phần tử

• Sử dụng thẻ <div> để nhóm các phần tử

• Sử dụng thẻ <p> để nhóm các phần tử

• Sử dụng thẻ <h2> để nhóm các phần tử

Multiple Choice

Bạn muốn làm nổi bật từ "quan trọng" trong câu "Câu này rất quan trọng và cần chú ý". Để làm điều này, bạn sẽ sử dụng thẻ nào?

• <b> để làm đậm từ "quan trọng"

• <mark> để làm nổi bật từ "quan trọng"

• <em> để làm nghiêng từ "quan trọng"

• <u> để gạch chân từ "quan trọng"

Multiple Choice

Bạn cần tạo một đoạn văn với một phần văn bản được làm nhỏ hơn so với phần còn lại. Cách nào sau đây là đúng?

• Dùng thẻ <small> để làm nhỏ phần văn bản cần thiết

• Dùng thẻ <sup> để làm nhỏ phần văn bản cần thiết

• Dùng thẻ <sub> để làm nhỏ phần văn bản cần thiết

• Dùng thẻ <mark> để làm nhỏ phần văn bản cần thiết

Multiple Choice

Bạn đang viết một bài báo và muốn tạo một phần văn bản có chỉ số trên (ví dụ: x²). Cách nào sau đây là đúng?

• Sử dụng thẻ <sup> để tạo chỉ số trên

• Sử dụng thẻ <sub> để tạo chỉ số trên

• Sử dụng thẻ <mark> để tạo chỉ số trên

• Sử dụng thẻ <i> để tạo chỉ số trên

Multiple Choice

Bạn muốn làm cho một câu văn bản trong HTML vừa đậm vừa nghiêng. Bạn sẽ sử dụng thẻ nào để đạt được điều này?

• Dùng cả thẻ <b> và <i>

• Dùng cả thẻ <strong> và <em>

• Dùng thẻ <strong> và <i> cùng một lúc

• Dùng thẻ <b> và <em> cùng một lúc