Đề Trắc nghiệm Tin học 12 - Bài F11: Định kiểu CSS cho bảng và phần tử (Chân Trời Sáng Tạo)

Đề Trắc nghiệm Tin học 12 – Bài F11: Định kiểu CSS cho bảng và phần tử

(Chân Trời Sáng Tạo) tổng hợp câu hỏi trắc nghiệm chứa đựng nhiều dạng bài tập, bài thi, cũng như các câu hỏi trắc nghiệm và bài kiểm tra, trong bộ Trắc Nghiệm Môn Tin Học 12 – Chân Trời Sáng Tạo. Nội dung trắc nghiệm nhấn mạnh phần kiến thức nền tảng và chuyên môn sâu của học phần này. Mọi bộ đề trắc nghiệm đều cung cấp câu hỏi, đáp án cùng hướng dẫn giải cặn kẽ. Mời bạn thử sức làm bài nhằm ôn luyện và làm vững chắc kiến thức cũng như đánh giá năng lực bản thân!

Đề 01

Đề 02

Đề 03

Đề 04

Đề 05

Đề 06

Đề 07

Đề 08

Đề 09

Đề 10

Bạn đã sẵn sàng chưa? 45 phút làm bài bắt đầu!!!

Bạn đã hết giờ làm bài! Xem kết quả các câu hỏi đã làm nhé!!!

Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

- Đề 01

1 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 01

Câu 1: Bạn đang định kiểu cho một bảng HTML. Bạn muốn các đường viền của các ô (`

`, `

`) và đường viền của chính bảng (`

`) chỉ hiển thị là một đường kẻ duy nhất, không bị tách rời hay có khoảng cách. Thuộc tính CSS nào sau đây cần được áp dụng cho phần tử `

` để đạt được hiệu ứng này?

border-spacing: 0;

border: 1px solid black;

border-collapse: collapse;

border-style: solid;

2 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 01

Câu 2: Để làm cho nội dung văn bản bên trong tất cả các ô dữ liệu (`

`) của bảng được căn giữa theo chiều ngang, bạn sẽ sử dụng thuộc tính CSS nào?

vertical-align: middle;

margin: auto;

padding: center;

text-align: center;

3 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 01

Câu 3: Bạn muốn tạo hiệu ứng sọc ngựa (màu nền xen kẽ) cho các hàng dữ liệu trong bảng để dễ đọc hơn. Cụ thể, bạn muốn các hàng chẵn (thứ 2, 4, 6...) có màu nền khác với các hàng lẻ. Quy tắc CSS nào sau đây sử dụng đúng pseudo-class để chọn các hàng chẵn?

tr:odd { background-color: #f2f2f2; }

tr:nth-child(even) { background-color: #f2f2f2; }

tr:nth-child(odd) { background-color: #f2f2f2; }

tr.even-row { background-color: #f2f2f2; }

4 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 01

Câu 4: Để tạo khoảng đệm bên trong mỗi ô dữ liệu (`

`) và ô tiêu đề (`

`) của bảng, giúp nội dung không bị dính sát vào đường viền, bạn sử dụng thuộc tính CSS nào?

padding

margin

border-spacing

text-indent

5 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 01

Câu 5: Xét đoạn mã CSS sau:
```css
table, th, td {
border: 1px solid black;
}
table {
border-collapse: separate;
border-spacing: 5px;
}
```
Đoạn mã này sẽ tạo ra hiệu ứng đường viền cho bảng như thế nào?

Đường viền đơn, không có khoảng cách giữa các ô.

Đường viền đôi, không có khoảng cách giữa các ô.

Đường viền đơn, mỗi ô có đường viền riêng nhưng dính liền.

Đường viền đơn cho mỗi ô, có khoảng cách 5px giữa các ô.

6 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 01

Câu 6: Để thay đổi màu nền của hàng tiêu đề bảng (`

`) thành màu xanh và màu chữ thành màu trắng, bạn sẽ sử dụng kết hợp các thuộc tính CSS nào?

background-image và font-color

border-color và text-decoration

background-color và color

list-style và font-weight

`) và các ô dữ liệu (`

`) trong bảng, bạn sẽ sử dụng thuộc tính CSS nào?

color

background-color

border-color

fill

` và `

`) trong mỗi hàng của bảng, bạn có thể sử dụng pseudo-class nào?

td:first-child

td:nth-child(odd)

td:last-child

td:only-child

`), ví dụ như căn lề tiêu đề ở phía dưới bảng thay vì mặc định ở trên, bạn sử dụng thuộc tính CSS nào cho `caption`?

text-align: bottom;

caption-side: bottom;

vertical-align: bottom;

position: bottom;

`), có thể là `top` (mặc định) hoặc `bottom`.

Bạn đã sẵn sàng chưa? 45 phút làm bài bắt đầu!!!

Bạn đã hết giờ làm bài! Xem kết quả các câu hỏi đã làm nhé!!!

Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

- Đề 02

1 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 02

Câu 1: Để loại bỏ khoảng cách giữa các đường viền của các ô trong bảng (table) và hiển thị chúng như một đường viền duy nhất, thuộc tính CSS nào cần được sử dụng cho phần tử `

border-spacing

border-style

border-collapse

border

2 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 02

Câu 2: Giả sử bạn có một bảng và muốn đường viền của nó xuất hiện dưới dạng đường viền đơn, không có khoảng trống giữa các ô. Bạn đã sử dụng `border-collapse: collapse;`. Để đặt màu cho đường viền này, bạn cần áp dụng thuộc tính `border-color` cho phần tử nào?

Chỉ cho `<table>`

Chỉ cho `<td>` và `<th>`

Chỉ cho `<tr>`

Cho cả `<table>` và `<td>`, `<th>`

` và `

`, `

` để định nghĩa đường viền chung.

3 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 02

Câu 3: Bạn muốn tạo một bảng có màu nền xen kẽ cho các hàng để dễ đọc hơn. Cụ thể, bạn muốn các hàng chẵn (2, 4, 6...) có màu nền khác với các hàng lẻ. Vùng chọn (selector) CSS nào phù hợp nhất để chọn các hàng chẵn trong bảng?

tr:nth-child(even)

tr:nth-child(odd)

tr:first-child

tr:last-child

4 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 02

Câu 4: Để đặt khoảng đệm (padding) bên trong mỗi ô dữ liệu (`

`) và ô tiêu đề (`

`) của bảng, giúp nội dung bên trong không bị sát vào đường viền, bạn sẽ áp dụng thuộc tính `padding` cho phần tử nào trong CSS?

<table>

td, th

tbody

`, `

`) để tạo khoảng cách giữa nội dung và đường viền của ô đó.

5 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 02

Câu 5: Bạn có một hàng tiêu đề (`

`) trong bảng và muốn chữ trong các ô tiêu đề này được căn giữa theo chiều ngang và in đậm. Thuộc tính CSS nào giúp căn giữa văn bản?

text-align

vertical-align

font-weight

align-items

6 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 02

Câu 6: Bạn muốn thay đổi màu nền của một hàng cụ thể trong bảng khi người dùng di chuột qua hàng đó. Lớp giả (pseudo-class) nào được sử dụng để định kiểu cho trạng thái di chuột (hover) của một phần tử?

:active

:focus

:hover

:visited

7 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 02

Câu 7: Bạn có hai phần tử `

` và muốn đặt chúng cạnh nhau trên cùng một dòng, với phần tử thứ nhất nằm bên trái và phần tử thứ hai nằm bên phải. Thuộc tính CSS nào được sử dụng phổ biến để đưa các phần tử cấp khối (block-level) lên cùng một dòng và định vị chúng sang trái hoặc phải?

display

float

position

align

8 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 02

Câu 8: Khi sử dụng thuộc tính `float` cho các phần tử `

`, các phần tử sau đó (không được float) có thể 'cuộn' lên và nằm cạnh các phần tử đã float, gây ra lỗi bố cục không mong muốn. Thuộc tính CSS nào được sử dụng để buộc một phần tử phải nằm dưới tất cả các phần tử đã float trước đó?

overflow

visibility

display

clear

9 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 02

Câu 9: Bạn đã sử dụng `float: left;` cho một `

` và `float: right;` cho một `

` khác để tạo bố cục hai cột. Tuy nhiên, phần tử footer nằm ngay sau hai `

` này lại bị chồng lên hoặc nằm cạnh chúng thay vì nằm ở dưới. Để khắc phục, bạn cần thêm một phần tử trống hoặc áp dụng thuộc tính `clear` cho phần tử footer. Giá trị nào của `clear` là phù hợp nhất trong trường hợp này?

clear: left;

clear: right;

clear: both;

clear: none;

10 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 02

Câu 10: Xét đoạn mã CSS sau:

```css
table {
border-collapse: collapse;
}
td, th {
border: 1px solid black;
padding: 8px;
}
```

Đoạn mã này sẽ định dạng bảng như thế nào?

Bảng có đường viền kép giữa các ô, nội dung sát đường viền.

Bảng có đường viền đơn giữa các ô, nội dung có khoảng đệm 8px.

Bảng không có đường viền, nội dung có khoảng đệm 8px.

Bảng có đường viền đơn, nội dung sát đường viền.

11 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 02

Câu 11: Để đặt khoảng cách giữa các đường viền của các ô trong bảng khi `border-collapse` có giá trị là `separate` (giá trị mặc định), thuộc tính CSS nào được sử dụng cho phần tử `

border-spacing

margin

padding

gap

12 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 02

Câu 12: Bạn muốn căn giữa nội dung của các ô dữ liệu (`

`) và màu chữ trắng cho các ô tiêu đề (`

` hoặc `

` bên trong `

`. Để định màu chữ cho các ô tiêu đề, áp dụng `color` cho `

`/`

`, bỏ qua kích thước nội dung.

tr:hover

tr:active

tr:focus

tr:nth-child(hover)

` chứa `

`) theo chiều dọc (ví dụ: nếu một ô có nhiều dòng văn bản, bạn muốn nó nằm chính giữa theo chiều cao của ô). Thuộc tính CSS nào được sử dụng để căn chỉnh nội dung theo chiều dọc trong ô bảng?

text-align

align-items

vertical-align

line-height

`, `

`).

13 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 02

Câu 13: Xét đoạn mã HTML và CSS sau:

```html

Box 1

Box 2

Some text after boxes.

```
```css
.box {
width: 100px;
height: 100px;
border: 1px solid black;
float: left;
}
.clear {
clear: both;
}
```

Kết quả hiển thị trên trình duyệt sẽ như thế nào?

Box 1 và Box 2 nằm cạnh nhau trên cùng một dòng, đoạn văn bản nằm ở dòng dưới cùng.

Box 1 nằm bên trái, Box 2 nằm bên phải ở dòng dưới cùng, đoạn văn bản nằm sau Box 2.

Box 1 và Box 2 nằm chồng lên nhau, đoạn văn bản nằm dưới cùng.

Box 1 và Box 2 nằm cạnh nhau, đoạn văn bản nằm ngay bên phải Box 2.

14 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 02

Câu 14: Bạn muốn đặt màu nền cho hàng tiêu đề (`

`) trong bảng của mình. Quy tắc CSS nào sau đây là đúng để thực hiện điều này?

thead { color: white; } th { background-color: blue; }

table { background-color: blue; } th { color: white; }

tr:first-child { background-color: blue; color: white; }

thead { background-color: blue; } th { color: white; }

15 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 02

Câu 15: Khi sử dụng `float: left;` cho một phần tử, điều gì xảy ra với luồng tài liệu thông thường (normal flow) của các phần tử khác?

Phần tử đó được đưa ra khỏi luồng thông thường, và các phần tử khác (đặc biệt là nội dung inline) sẽ bao bọc nó.

Phần tử đó vẫn nằm trong luồng thông thường nhưng được dịch chuyển sang trái.

Tất cả các phần tử sau đó đều bị đẩy xuống dòng mới.

Chỉ các phần tử inline sau đó bị ảnh hưởng.

16 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 02

Câu 16: Bạn có một bảng lớn và muốn cố định chiều rộng của các cột ngay cả khi nội dung bên trong vượt quá. Thuộc tính CSS nào cho phép bạn đặt thuật toán bố cục bảng để chiều rộng cột chỉ dựa vào chiều rộng bảng và chiều rộng cột được thiết lập, bỏ qua nội dung?

width

column-width

layout-algorithm

table-layout

`) trong một bảng?

.th

#th

table th

22 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 02

Câu 22: Bạn có một bố cục với một `

` float trái và một `

` float phải. Nội dung sau chúng bị bố cục sai. Bạn đã thêm một `div` trống với class `clear` và áp dụng `clear: both;` cho nó. Tại sao việc thêm `div` trống này đôi khi được sử dụng để khắc phục vấn đề float?

Nó giúp định nghĩa rõ ràng chiều cao của các phần tử float.

Nó tạo ra một khoảng trống tự động giữa các phần tử float và nội dung sau.

Nó buộc các phần tử float phải nằm trong giới hạn của phần tử cha.

Nó tạo ra một điểm trong tài liệu mà không có phần tử float nào được phép nằm cạnh nó, đẩy nội dung sau xuống dưới.

23 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 02

Câu 23: Thuộc tính `border-spacing` trong CSS dùng để làm gì khi áp dụng cho phần tử `

Đặt khoảng cách giữa các đường viền của các ô trong bảng khi border-collapse là separate.

Đặt khoảng cách bên trong các ô (padding).

Đặt khoảng cách bên ngoài bảng (margin).

Đặt khoảng cách giữa các dòng văn bản trong ô bảng.

Khi thuộc tính border-collapse có giá trị là collapse.

Khi thuộc tính width của bảng được thiết lập.

Khi các ô trong bảng có padding.

Khi các hàng trong bảng có màu nền xen kẽ.

Xem kết quả

Bạn đã sẵn sàng chưa? 45 phút làm bài bắt đầu!!!

Bạn đã hết giờ làm bài! Xem kết quả các câu hỏi đã làm nhé!!!

Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

- Đề 03

1 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 03

Câu 1: Trong CSS, thuộc tính nào sau đây được sử dụng để kiểm soát cách hiển thị đường viền của các ô trong bảng (cell borders), đặc biệt là khi chúng gặp nhau?

border-spacing

border-collapse

border-style

table-layout

` để xác định xem đường viền của các ô liền kề có được gộp lại thành một đường viền duy nhất (`collapse`) hay hiển thị riêng biệt (`separate`).

2 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 03

Câu 2: Bạn muốn tạo một bảng HTML mà đường viền giữa các ô liền kề được gộp lại thành một đường đơn, thay vì hiển thị hai đường viền riêng biệt. Cần áp dụng quy tắc CSS nào cho thẻ `

border-spacing: 0;

border-style: collapsed;

border-collapse: collapse;

border: 1px solid black;

` hoặc bộ chọn áp dụng cho bảng.

3 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 03

Câu 3: Để đặt màu nền xen kẽ cho các hàng chẵn trong bảng HTML, bạn sử dụng bộ chọn (selector) và thuộc tính CSS nào sau đây?

tr:nth-child(even) { background-color: #f2f2f2; }

tr:hover { background-color: #f2f2f2; }

td:nth-child(even) { background-color: #f2f2f2; }

table tr:even { background-color: #f2f2f2; }

`) ở vị trí chẵn trong bảng. Thuộc tính `background-color` được dùng để đặt màu nền cho các hàng được chọn này.

4 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 03

Câu 4: Bạn muốn khi người dùng di chuột (hover) qua một hàng bất kỳ trong bảng, hàng đó sẽ đ???i màu nền để dễ nhận biết. Cần sử dụng bộ chọn giả lớp (pseudo-class) nào trong CSS?

tr:active

tr:focus

tr:visited

tr:hover

` (`tr:hover`) sẽ định kiểu cho hàng khi di chuột qua.

5 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 03

Câu 5: Đoạn mã CSS sau áp dụng cho bảng: `table, th, td { border: 1px solid black; padding: 8px; }`. Tác dụng của thuộc tính `padding: 8px;` áp dụng cho `th, td` là gì?

Tạo khoảng trống giữa nội dung (text) và đường viền của mỗi ô.

Tạo khoảng trống giữa các ô liền kề trong bảng.

Thiết lập độ dày của đường viền cho mỗi ô.

Căn chỉnh văn bản ra giữa theo chiều ngang trong mỗi ô.

6 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 03

Câu 6: Để đặt màu nền và màu chữ cho hàng tiêu đề của bảng (sử dụng thẻ `

` hoặc các ô `

` để xác định chiều rộng của tất cả các ô trong cột đó. Nội dung dài hơn chiều rộng cột sẽ bị cắt bớt hoặc hiển thị tràn ra ngoài, thay vì làm cột tự mở rộng để chứa nội dung.

` trong hàng đầu tiên), bạn thường áp dụng các thuộc tính CSS nào? border-color và text-color background-color và color font-size và padding text-align và border-width Để định màu nền, ta dùng `background-color`. Để định màu chữ, ta dùng `color`. Các thuộc tính này được áp dụng cho bộ chọn nhắm vào hàng tiêu đề (`thead tr` hoặc `th`). 7 / 30 Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử Tags: Bộ đề 03 Câu 7: Thuộc tính CSS nào thường được sử dụng để di chuyển một phần tử (ví dụ: một ` `) sang bên trái hoặc bên phải, cho phép các phần tử khác (như văn bản hoặc các ` ` khác) bao quanh nó? position display float margin Thuộc tính `float` với giá trị `left` hoặc `right` được sử dụng để đưa một phần tử ra khỏi luồng tài liệu thông thường và đẩy nó sang một bên, cho phép nội dung khác chảy quanh nó. Đây là kỹ thuật phổ biến để tạo bố cục cột đơn giản hoặc đặt hình ảnh bên cạnh văn bản. 8 / 30 Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử Tags: Bộ đề 03 Câu 8: Khi sử dụng thuộc tính `float` cho một hoặc nhiều phần tử ` `, đôi khi phần tử cha chứa các ` ` này bị 'sụp đổ' chiều cao (height collapse) hoặc các phần tử đứng sau bị ảnh hưởng bố cục. Thuộc tính CSS nào thường được dùng để 'xóa bỏ' (clear) ảnh hưởng của float và khôi phục luồng tài liệu bình thường sau các phần tử được float? clear overflow display position Thuộc tính `clear` được sử dụng để chỉ định rằng một phần tử không được nằm bên cạnh các phần tử đã được float. Giá trị `both` là phổ biến nhất, đảm bảo phần tử đó sẽ nằm dưới bất kỳ phần tử nào được float sang trái hoặc phải trước đó, khắc phục các vấn đề bố cục do float gây ra. 9 / 30 Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử Tags: Bộ đề 03 Câu 9: Bạn có hai phần tử ` ` muốn đặt cạnh nhau trên cùng một dòng, với `div` thứ nhất nằm bên trái và `div` thứ hai nằm bên phải. Kỹ thuật CSS phổ biến nào sử dụng thuộc tính `float` để đạt được bố cục này? Sử dụng `display: inline-block;` cho cả hai `div`. Sử dụng `float: left;` cho `div` thứ nhất và `float: right;` cho `div` thứ hai (hoặc cả hai float left và điều chỉnh width). Sử dụng `position: absolute;` cho cả hai `div`. Sử dụng `margin: auto;` cho cả hai `div`. Để đặt hai block element (như ` `) cạnh nhau, bạn có thể sử dụng `float`. Áp dụng `float: left;` cho `div` thứ nhất và `float: right;` cho `div` thứ hai (hoặc cả hai đều `float: left;` và điều chỉnh `width`). Kỹ thuật này đưa chúng ra khỏi luồng và cho phép chúng xếp cạnh nhau nếu có đủ không gian. 10 / 30 Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử Tags: Bộ đề 03 Câu 10: Giả sử bạn có một `div` được float sang trái (`float: left;`). Nếu một phần tử `p` đứng ngay sau `div` đó trong mã HTML, điều gì có khả năng xảy ra với văn bản trong thẻ `p` theo mặc định? Văn bản trong thẻ `p` sẽ chảy (wrap) xung quanh phần tử `div` được float. Thẻ `p` sẽ tự động di chuyển xuống dòng dưới phần tử `div`. Thẻ `p` sẽ nằm đè lên phần tử `div`. Thẻ `p` sẽ bị ẩn đi. Khi một phần tử được float, nó được đưa ra khỏi luồng tài liệu bình thường. Các phần tử block element đứng sau nó (như `p`) sẽ bắt đầu ngay dưới phần tử float (nếu có đủ không gian), nhưng nội dung (văn bản, hình ảnh) của chúng sẽ chảy xung quanh phần tử được float. 11 / 30 Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử Tags: Bộ đề 03 Câu 11: Bạn có đoạn mã CSS sau: `.data-table { width: 80%; margin: 20px auto; border-collapse: collapse; }`. Quy tắc `margin: 20px auto;` áp dụng cho bảng có class `data-table` có tác dụng gì? Đặt khoảng trống 20px ở phía trên và dưới bảng, và 20px ở hai bên trái phải. Chỉ đặt khoảng trống 20px ở phía trên và dưới bảng. Tạo khoảng trống 20px bên trong đường viền của bảng. Đặt khoảng trống 20px ở phía trên và dưới bảng, đồng thời căn giữa bảng theo chiều ngang. Khi áp dụng cho một phần tử block element có chiều rộng (`width`) xác định, `margin: auto;` ở hai bên (trái và phải) sẽ tự động tính toán và phân bổ khoảng trống còn lại, giúp căn giữa phần tử đó theo chiều ngang trong phần tử cha. 12 / 30 Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử Tags: Bộ đề 03 Câu 12: Xét đoạn mã CSS: `.box { width: 150px; height: 100px; border: 1px solid blue; float: left; margin: 10px; }`. Đoạn mã này sẽ định kiểu cho một `div` có class `box` như thế nào? Tạo một hộp màu xanh lá cây, kích thước 150x100, đường viền đơn, trôi sang phải và có khoảng trống 10px bên trong. Tạo một hộp màu xanh dương, kích thước 150x100, đường viền đơn, nằm yên tại vị trí ban đầu và có khoảng trống 10px bên ngoài. Tạo một hộp màu xanh dương, kích thước 150x100, đường viền đơn, trôi sang trái và có khoảng trống 10px bên ngoài. Tạo một hộp không có đường viền, kích thước 150x100, trôi sang trái và có khoảng trống 10px bên trong. Phân tích các thuộc tính: `width` và `height` xác định kích thước; `border` tạo đường viền; `float: left` khiến `div` trôi sang trái và các phần tử khác có thể bao quanh nó; `margin: 10px` tạo khoảng trống 10px xung quanh `div` (ngoài đường viền). 13 / 30 Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử Tags: Bộ đề 03 Câu 13: Bạn có một `div` cha chứa hai `div` con. Cả hai `div` con đều được áp dụng `float: left;`. Nếu `div` cha không có nội dung nào khác ngoài hai `div` con này và không được định chiều cao cố định, điều gì có khả năng xảy ra với chiều cao của `div` cha? Chiều cao của `div` cha sẽ tự động điều chỉnh để bao bọc hết cả hai `div` con được float. Chiều cao của `div` cha có thể bị 'sụp đổ' (height collapse) vì các `div` con đã được đưa ra khỏi luồng bình thường. Chiều cao của `div` cha sẽ bằng tổng chiều cao của hai `div` con cộng lại. Chiều cao của `div` cha sẽ bằng chiều cao của `div` con cao hơn. Khi các phần tử con được float, chúng được đưa ra khỏi luồng tài liệu thông thường. Phần tử cha, theo mặc định, sẽ tính chiều cao dựa trên nội dung trong luồng. Nếu tất cả nội dung của phần tử cha đều được float, phần tử cha sẽ không 'nhìn thấy' chúng trong luồng và chiều cao của nó sẽ bị 'sụp đổ' (height collapse) xuống 0 hoặc chỉ bằng chiều cao của các phần tử không được float (nếu có). 14 / 30 Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử Tags: Bộ đề 03 Câu 14: Để khắc phục vấn đề 'sụp đổ' chiều cao của phần tử cha khi chứa các phần tử được float, một kỹ thuật phổ biến là thêm một phần tử (thường là một `div` trống hoặc sử dụng pseudo-element `::after`) ở cuối phần tử cha và áp dụng thuộc tính `clear`. Giá trị nào của thuộc tính `clear` cần sử dụng để 'xóa bỏ' ảnh hưởng của cả `float: left;` và `float: right;`? clear: left; clear: right; clear: both; clear: none; Thuộc tính `clear: both;` trên một phần tử đảm bảo rằng phần tử đó sẽ không nằm cạnh bất kỳ phần tử nào được float sang trái hoặc phải trước đó. Điều này hiệu quả trong việc buộc phần tử đó phải bắt đầu ở dòng mới sau các phần tử được float, từ đó giúp phần tử cha 'nhận biết' được chiều cao của các phần tử được float và mở rộng để chứa chúng. 15 / 30 Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử Tags: Bộ đề 03 Câu 15: Bạn đang thiết kế bố cục cho một trang web và muốn có một khu vực chính (main content) và một thanh bên (sidebar) nằm cạnh nhau. Cả hai khu vực này đều là các khối độc lập (ví dụ: sử dụng thẻ ` `). Thuộc tính CSS nào là công cụ chính để đặt chúng cạnh nhau theo cách này? float position display: inline; margin Kỹ thuật sử dụng `float: left;` hoặc `float: right;` cho các phần tử khối (như `div`) kết hợp với việc định chiều rộng (`width`) là phương pháp truyền thống và cơ bản để tạo bố cục nhiều cột, như main content và sidebar, trong CSS. 16 / 30 Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử Tags: Bộ đề 03 Câu 16: Xét một bảng HTML có nhiều cột. Bạn muốn cột thứ ba luôn có chiều rộng cố định là 150px, bất kể nội dung của các cột khác dài hay ngắn. Cần áp dụng CSS cho bộ chọn nào và sử dụng thuộc tính nào? table { width: 150px; } td:nth-child(3) { width: 150px; } tr:nth-child(3) { width: 150px; } table col:nth-child(3) { width: 150px; } Để định kiểu cho cột thứ ba, bạn có thể sử dụng bộ chọn `td:nth-child(3)` (hoặc `th:nth-child(3)` cho tiêu đề cột). Thuộc tính `width` được dùng để đặt chiều rộng cố định cho các ô trong cột đó. 17 / 30 Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử Tags: Bộ đề 03 Câu 17: Trong CSS, sự khác biệt cơ bản giữa thuộc tính `margin` và `padding` khi áp dụng cho một phần tử ` ` là gì? `margin` tạo khoảng trống bên trong phần tử, còn `padding` tạo khoảng trống bên ngoài phần tử. `margin` chỉ áp dụng cho các phần tử inline, còn `padding` áp dụng cho các phần tử block. `margin` có thể có giá trị âm, còn `padding` thì không. `padding` tạo khoảng trống bên trong đường viền, còn `margin` tạo khoảng trống bên ngoài đường viền. Theo mô hình hộp (box model) của CSS, `padding` là khoảng trống bên trong đường viền của phần tử (giữa nội dung và đường viền), còn `margin` là khoảng trống bên ngoài đường viền của phần tử (giữa phần tử đó và các phần tử xung quanh). 18 / 30 Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử Tags: Bộ đề 03 Câu 18: Bạn có một bảng dữ liệu. Để làm cho bảng dễ đọc hơn, bạn muốn tăng khoảng cách giữa đường viền của mỗi ô và nội dung bên trong ô đó. Thuộc tính nào cần điều chỉnh, áp dụng cho `	` và `	`? padding margin border-spacing line-height Khoảng cách giữa nội dung và đường viền bên trong một phần tử được kiểm soát bởi thuộc tính `padding`. Áp dụng `padding` cho các ô tiêu đề (`	`) và ô dữ liệu (`	`) sẽ tăng khoảng cách này. 19 / 30 Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử Tags: Bộ đề 03 Câu 19: Xét đoạn mã HTML và CSS sau: ```html Box 1 Box 2 ``` Mục đích của `div` cuối cùng với `style="clear: both;"` là gì? Để tạo thêm một khoảng trống 100% chiều rộng dưới Box 2. Để đảm bảo Box 2 nằm ở bên phải của Box 1. Để thiết lập lại thuộc tính float cho các phần tử tiếp theo. Để 'xóa bỏ' ảnh hưởng của các phần tử được float trước đó và đảm bảo phần tử cha bao bọc chúng đúng cách. Hai `div` con được float ra khỏi luồng bình thường, có thể gây ra vấn đề 'sụp đổ' chiều cao cho `div` cha (`container`). Việc thêm một phần tử (ở đây là một `div` trống) ngay sau các phần tử float và áp dụng `clear: both;` cho nó sẽ buộc phần tử này phải nằm dưới tất cả các float trước đó. Điều này giúp phần tử cha bao bọc được các phần tử float, 'xóa bỏ' ảnh hưởng của float đối với bố cục tiếp theo. 20 / 30 Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử Tags: Bộ đề 03 Câu 20: Bạn muốn tạo một thanh tiêu đề (header) cho trang web sử dụng thẻ ` `. Thanh tiêu đề này cần có màu nền đặc trưng và chiều cao cố định. Các thuộc tính CSS cơ bản nào là cần thiết để định kiểu cho `div` này? background-color và height float và clear margin và padding border và outline Để đặt màu nền, ta dùng `background-color`. Để đặt chiều cao, ta dùng `height`. Đây là hai thuộc tính cơ bản và quan trọng nhất để định hình kích thước và màu sắc cho một `div` làm thanh tiêu đề. 21 / 30 Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử Tags: Bộ đề 03 Câu 21: Giả sử bạn có một bảng dữ liệu lớn. Để cải thiện hiệu suất hiển thị, bạn có thể sử dụng thuộc tính `table-layout` với giá trị `fixed`. Khi sử dụng `table-layout: fixed;`, điều gì sẽ xảy ra với cách trình duyệt tính toán chiều rộng cột? Trình duyệt sẽ tính toán chiều rộng cột dựa trên nội dung dài nhất trong mỗi cột. Trình duyệt sẽ tự động chia đều chiều rộng cho tất cả các cột. Trình duyệt sẽ sử dụng chiều rộng được thiết lập cho các ô trong hàng đầu tiên hoặc thẻ `<col>` để xác định chiều rộng cố định cho toàn bộ cột. Thuộc tính này không ảnh hưởng đến cách tính chiều rộng cột. Với `table-layout: fixed;`, trình duyệt sẽ sử dụng chiều rộng của bảng và chiều rộng của cột được thiết lập trong hàng đầu tiên (thẻ `	` hoặc `	`) hoặc thẻ `

Tiêu đề 1	Tiêu đề 2
Dữ liệu 1A	Dữ liệu 1B
Dữ liệu 2A	Dữ liệu 2B

```
CSS:
```css
table, th, td {
border: 1px solid black;
}
```
Để các đường viền trong bảng được hiển thị dưới dạng đường viền đơn, không bị tách rời giữa các ô, bạn cần bổ sung thuộc tính CSS nào vào quy tắc cho thẻ `table`?

border-spacing: 0;

border-style: collapse;

table-layout: fixed;

border-collapse: collapse;

2 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 04

Câu 2: Bạn muốn tạo một bảng dữ liệu trong trang web, trong đó các hàng chẵn có màu nền xám nhạt (#f2f2f2) và các hàng lẻ có màu nền trắng (#ffffff). Bạn sẽ sử dụng bộ chọn (selector) và thuộc tính CSS nào để đạt được hiệu ứng này?

tr:even { background-color: #f2f2f2; } tr:odd { background-color: #ffffff; }

tr.even { background-color: #f2f2f2; } tr.odd { background-color: #ffffff; }

tr:nth-child(even) { background-color: #f2f2f2; } tr:nth-child(odd) { background-color: #ffffff; }

tr > td:nth-child(2n) { background-color: #f2f2f2; } tr > td:nth-child(2n+1) { background-color: #ffffff; }

3 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 04

Câu 3: Để căn giữa nội dung theo chiều ngang cho tất cả các ô tiêu đề (`

`) và ô dữ liệu (`

`) trong một bảng, bạn cần áp dụng thuộc tính CSS nào cho các bộ chọn `th, td`?

align-items: center;

text-align: center;

justify-content: center;

vertical-align: middle;

4 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 04

Câu 4: Bạn muốn khi người dùng di chuột (hover) qua một hàng bất kỳ trong bảng, hàng đó sẽ đổi màu nền để dễ nhận biết. Bạn sẽ sử dụng bộ chọn giả lớp (pseudo-class) nào cho phần tử `

`) và nội dung bên trong chúng (ví dụ: thêm 8px khoảng đệm), bạn cần áp dụng thuộc tính CSS nào cho bộ chọn `td`?

padding: 8px;

margin: 8px;

border-spacing: 8px;

height: auto;

`) của bảng có màu nền xanh đậm và chữ màu trắng. Bạn sẽ áp dụng quy tắc CSS nào?

th { background-color: navy; color: white; }

th { background: white; text-color: navy; }

thead { background-color: navy; font-color: white; }

tr:first-child { background-color: navy; color: white; }

17 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 04

Câu 17: Khi định kiểu cho bảng, việc sử dụng `caption-side: top;` có tác dụng gì?

Đặt tiêu đề của bảng ở phía dưới bảng.

Căn giữa nội dung của tiêu đề bảng theo chiều ngang.

Đặt tiêu đề của bảng ở phía trên bảng.

Tạo khoảng trống giữa tiêu đề và phần nội dung bảng.

` của bảng.

`) có chiều cao lớn hơn các hàng dữ liệu. Cách hiệu quả nhất để làm điều này là áp dụng thuộc tính `height` cho phần tử nào?

table th { height: ...; }

table tr:first-child { height: ...; }

th { height: ...; }

Áp dụng thuộc tính `height` cho các phần tử `th` bên trong hàng tiêu đề, hoặc cho chính `tr` của hàng tiêu đề.

24 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 04

Câu 24: Giả sử bạn đã định kiểu cho một phần tử `div` có đường viền (`border`). Bạn muốn thêm một đường viền phụ bên ngoài đường viền chính, không làm thay đổi kích thước bố cục của phần tử. Thuộc tính CSS nào được thiết kế cho mục đích này?

outline

box-shadow

border-image

border-extra

25 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 04

Câu 25: Bạn muốn tạo một bảng có chiều rộng chiếm 80% chiều rộng của vùng chứa (ví dụ: cửa sổ trình duyệt hoặc phần tử cha). Bạn sẽ áp dụng quy tắc CSS nào cho thẻ `

table { size: 80%; }

table { max-width: 80%; }

table { width: 80%; }

table { percentage-width: 80; }

26 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 04

Câu 26: Khi sử dụng `float` cho nhiều phần tử `div` để tạo bố cục nhiều cột, nếu tổng chiều rộng của các phần tử `div` (bao gồm cả `margin`, `padding`, `border`) lớn hơn chiều rộng của phần tử chứa, hiện tượng gì có thể xảy ra?

Các phần tử sẽ tự động co lại để vừa với chiều rộng vùng chứa.

Các phần tử sẽ bị đẩy xuống dòng dưới.

Trang web sẽ bị lỗi và không hiển thị gì.

Các phần tử sẽ chồng lên nhau.

27 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 04

Câu 27: Để thêm khoảng trống 10px ở phía trên và 20px ở phía dưới cho một phần tử `div` mà không ảnh hưởng đến khoảng trống bên trái và bên phải, bạn sẽ sử dụng cú pháp rút gọn nào của thuộc tính `margin`?

margin: 10px 0 20px 0;

margin: 10px 20px;

margin-top: 10px; margin-bottom: 20px;

margin-vertical: 10px 20px;

28 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 04

Câu 28: Bạn muốn tất cả các ô dữ liệu (`

tr:active

tr:hover

tr:focus

tr:visited

8 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 05

Câu 8: Bạn có hai phần tử `div` cần hiển thị cạnh nhau. `div` thứ nhất rộng 200px, `div` thứ hai rộng 300px. Cả hai đều được thiết lập `float: left;`. Nếu tổng chiều rộng của vùng chứa đủ lớn (ví dụ: 600px), kết quả bố cục sẽ là gì?

Hai div sẽ nằm cạnh nhau trên cùng một hàng.

Div thứ hai sẽ nằm dưới div thứ nhất.

Hai div sẽ chồng lên nhau.

Chỉ div thứ nhất được hiển thị.

9 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 05

Câu 9: Để đặt khoảng cách *bên trong* mỗi ô dữ liệu (`

thứ nhất, rồi

thứ hai chứa 'Dữ liệu 2A'). Hàng tiêu đề là hàng thứ nhất, hàng 'Dữ liệu 1A' là hàng thứ hai, hàng 'Dữ liệu 2A' là hàng thứ ba.

` hoặc `

21 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 05

Câu 21: Bạn có một layout gồm header, hai cột nội dung (sidebar và main content) và footer. Cả sidebar và main content đều được float. Để đảm bảo footer nằm *bên dưới* cả hai cột nội dung, bạn cần áp dụng CSS `clear: both;` cho phần tử nào?

Phần tử header.

Cả hai phần tử sidebar và main content.

Phần tử footer.

Phần tử cha chứa sidebar và main content.

22 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 05

Câu 22: Thuộc tính `border-radius` được sử dụng để làm gì cho các phần tử hình hộp (như `div`)?

Tạo bóng đổ cho phần tử.

Xoay phần tử.

Thêm đường gạch dưới cho văn bản.

Bo tròn các góc của phần tử.

23 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 05

Câu 23: Giả sử bạn muốn hàng tiêu đề của bảng (`

` hoặc các ô `

`), bạn sử dụng bộ chọn CSS nào?

` đại diện cho phần thân của bảng.

26 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 26: Xét hai khối `div`, khối A và khối B, cả hai đều có `float: left;`. Nếu khối A có chiều rộng 300px và khối B có chiều rộng 400px, và phần tử chứa chúng có chiều rộng 600px. Điều gì sẽ xảy ra?

27 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 27: Bạn muốn tạo một khoảng trống 15px *chỉ* ở phía trên của một khối `div`. Thuộc tính nào sau đây là đúng cú pháp?

28 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 28: Để đặt màu nền cho hàng *lẻ* của bảng, bạn sẽ sử dụng bộ chọn nào kết hợp với thuộc tính `background-color`?

29 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 29: Khi sử dụng `float: left;` cho một phần tử `div`, thuộc tính `width` của phần tử đó nên được thiết lập như thế nào để kiểm soát bố cục hiệu quả?

30 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 30: Thuộc tính `

`) trong bảng có đường viền dưới nét đứt màu xanh dương. Bạn sẽ áp dụng quy tắc CSS nào?

td { border-bottom-style: dashed blue; }

td { border-bottom: blue dashed; }

td { border-style-bottom: dashed; border-color-bottom: blue; }

td { border-bottom: 1px dashed blue; }

29 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 04

Câu 29: Phân tích sự khác biệt cơ bản giữa thuộc tính `padding` và `margin` khi áp dụng cho một phần tử `div` có đường viền?

Padding tạo khoảng trống bên trong đường viền (giữa nội dung và đường viền), còn margin tạo khoảng trống bên ngoài đường viền (giữa phần tử và các phần tử khác).

Padding chỉ áp dụng cho các phần tử inline, còn margin chỉ áp dụng cho các phần tử block.

Padding ảnh hưởng đến kích thước của phần tử, còn margin không ảnh hưởng.

Margin tạo khoảng trống chỉ theo chiều ngang, còn padding tạo khoảng trống chỉ theo chiều dọc.

30 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 04

Câu 30: Bạn có một bảng và muốn tất cả các ô tiêu đề (`

`) được in đậm và căn giữa theo chiều ngang. Mặc định thẻ `

` đã in đậm, nhưng bạn cần đảm bảo căn giữa. Bạn sẽ sử dụng quy tắc CSS nào?

th { align: center; }

th { text-align: center; }

th { vertical-align: middle; }

th { display: flex; justify-content: center; }

Xem kết quả

`) của bảng có màu nền xanh dương và chữ màu trắng. Quy tắc CSS nào sau đây thực hiện đúng yêu cầu này?

th { background-color: blue; color: white; }

tr:first-child { background-color: blue; text-color: white; }

thead { background-color: blue; font-color: white; }

td:first-child { background-color: blue; color: white; }

6 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 05

Câu 6: Giả sử bạn có một phần tử `div` được thiết lập `float: left;`. Sau đó là một đoạn văn bản (`

`). Đoạn văn bản này có thể bị "cuốn" lên nằm bên cạnh `div` đó. Để đảm bảo đoạn văn bản luôn bắt đầu *bên dưới* phần tử `div` đã float, bạn cần áp dụng thuộc tính CSS nào cho phần tử `

position: relative;

overflow: hidden;

clear: both;

display: block;

7 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 05

Câu 7: Để định kiểu cho trạng thái khi người dùng di chuột qua một hàng bất kỳ trong bảng (hiệu ứng hover), bạn sẽ sử dụng bộ chọn giả (pseudo-class) nào kết hợp với phần tử `

`) của bảng (tức là khoảng cách giữa nội dung văn bản và đường viền của ô), bạn sử dụng thuộc tính CSS nào?

margin

padding

border-spacing

text-indent

10 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 05

Câu 10: Bạn muốn căn giữa nội dung văn bản theo chiều ngang trong tất cả các ô tiêu đề (`

`) và ô dữ liệu (`

`) của bảng. Thuộc tính CSS nào là phù hợp nhất?

align-items: center;

vertical-align: middle;

text-align: center;

justify-content: center;

11 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 05

Câu 11: Xét đoạn CSS sau áp dụng cho một phần tử `div`:
```css
.my-div {
width: 200px;
padding: 10px;
border: 5px solid black;
margin: 15px;
}
```
Tổng chiều rộng thực tế mà phần tử `div` này chiếm trên trang (bao gồm nội dung, padding, border và margin) là bao nhiêu pixels?

200px

220px

230px

260px

12 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 05

Câu 12: Để định kiểu cho đường viền của *mỗi* ô trong bảng (`

` và `

`) có độ dày 1px, kiểu nét liền và màu xanh dương, bạn sử dụng quy tắc CSS nào?

td, th { border: 1px solid blue; }

table { border: 1px solid blue; }

td th { border: 1px solid blue; }

tr { border: 1px solid blue; }

13 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 05

Câu 13: Thuộc tính CSS `caption-side` được sử dụng để định vị chú thích (`

`) của bảng. Giá trị mặc định của thuộc tính này là gì?

bottom

top

left

right

14 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 05

Câu 14: Bạn muốn tạo một phần tử `div` có chiều rộng cố định 300px và căn giữa theo chiều ngang trong phần tử cha của nó. Quy tắc CSS nào sau đây giúp bạn đạt được điều này?

width: 300px; text-align: center;

width: 300px; align-items: center;

width: 300px; margin-left: auto; margin-right: auto;

width: 300px; float: center;

15 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 05

Câu 15: Xét bảng HTML sau:
```html

Tiêu đề 1	Tiêu đề 2
Dữ liệu 1A	Dữ liệu 1B
Dữ liệu 2A	Dữ liệu 2B

```
Để chỉ áp dụng màu nền cho hàng có chứa "Dữ liệu 2A" và "Dữ liệu 2B", bạn sẽ sử dụng bộ chọn CSS nào?

tr:first-child

tr:last-child

tr:nth-child(2)

tr:nth-child(3)

`, tiếp theo là

` hoặc `

` trong cột đó, hoặc sử dụng phần tử `

`) có chữ in đậm và căn giữa theo mặc định. Quy tắc CSS nào sau đây là *không cần thiết* nếu bạn chỉ định kiểu cho `

background-color

font-weight: bold; và text-align: center;

padding

border

`. Thẻ `

` theo mặc định đã có chữ in đậm và căn giữa theo chiều ngang.

`) có màu nền riêng và chữ màu trắng để phân biệt. Thuộc tính nào sau đây cần sử dụng để đặt màu chữ cho hàng tiêu đề?

5 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 5: Xét đoạn CSS sau áp dụng cho các ô dữ liệu (`

`) trong bảng: `td { padding: 10px; }`. Đoạn CSS này có tác dụng gì?

6 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 6: Bạn muốn tạo hai khối nội dung (`

`) nằm cạnh nhau trên cùng một dòng. Thuộc tính CSS nào là lựa chọn phổ biến nhất để thực hiện bố cục này bằng cách làm cho các khối 'trôi' sang một bên?

7 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 7: Khi sử dụng thuộc tính `float` cho một phần tử, các phần tử đứng sau nó trong luồng tài liệu bình thường có thể 'cuộn' lên và nằm cạnh phần tử bị float, gây ra lỗi bố cục không mong muốn. Thuộc tính CSS nào được sử dụng để 'xóa' hiệu ứng float và đảm bảo phần tử đó bắt đầu dưới tất cả các phần tử bị float trước đó?

8 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 8: Xét hai khối `div` có class là `left-block` và `right-block`. Bạn đã áp dụng `float: left;` cho `left-block` và `float: right;` cho `right-block`. Nếu chiều cao của `left-block` lớn hơn `right-block`, và có một khối `div` thứ ba (`footer`) ngay sau hai khối này trong HTML, điều gì có khả năng xảy ra với khối `footer` nếu không có thêm CSS?

9 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 9: Để tạo khoảng trống bên ngoài đường viền của một phần tử `

`, đẩy các phần tử xung quanh ra xa nó, bạn sử dụng thuộc tính CSS nào?

10 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 10: Bạn có một bảng và muốn đặt đường viền cho toàn bộ bảng với độ dày 2px, kiểu nét liền (solid) và màu xanh dương. Đoạn CSS nào sau đây là đúng và hiệu quả nhất để làm điều này?

11 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 11: Khi sử dụng `border-collapse: collapse;` cho bảng, điều gì xảy ra với thuộc tính `border-spacing`?

12 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 12: Bạn muốn đặt màu nền cho *tất cả* các ô tiêu đề (`

`) trong bảng của mình. Bộ chọn CSS nào là phù hợp nhất?

` được sử dụng cho các ô tiêu đề.

13 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 13: Xét đoạn HTML sau: `

Nội dung

`. Bạn muốn đặt đường viền cho khối `div` có class là `box`. Bộ chọn CSS nào nhắm mục tiêu chính xác vào khối `box`?

14 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 14: Thuộc tính CSS nào thường được sử dụng để căn giữa nội dung (văn bản, hình ảnh) bên trong một ô bảng (`

` hoặc `

`) hoặc một khối `

15 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 15: Để đặt khoảng cách giữa đường viền của ô bảng và đường viền của bảng khi `border-collapse` có giá trị là `separate`, bạn sử dụng thuộc tính nào?

16 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 16: Xét đoạn CSS: `.my-div { width: 50%; margin: 0 auto; }`. Đoạn CSS này sẽ làm gì với khối `div` có class là `my-div`?

17 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 17: Bạn có một bảng và muốn đặt đường viền chỉ cho phía dưới của hàng tiêu đề (`

`). Thuộc tính nào là phù hợp nhất?

18 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 18: Để đặt khoảng trống *bên trong* ô bảng (`

`) giữa nội dung và đường viền, bạn sử dụng thuộc tính nào?

19 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 19: Bạn có hai khối `div` muốn đặt cạnh nhau. Khối thứ nhất có `float: left;`. Khối thứ hai nên có CSS như thế nào để cũng nằm cạnh khối thứ nhất (nếu đủ chỗ)?

20 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 20: Thuộc tính `vertical-align` trong CSS chủ yếu được sử dụng để làm gì trong ngữ cảnh của ô bảng (`

` hoặc `

`)?

21 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 21: Xét đoạn CSS: `table, th, td { border: 1px solid black; }`. Nếu không có thêm CSS nào khác liên quan đến đường viền, kiểu đường viền mặc định của bảng này sẽ là gì?

22 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 22: Bạn muốn thiết kế một bố cục gồm một cột bên trái (chiều rộng cố định) và một cột bên phải (chiếm phần còn lại). Sử dụng `float: left;` cho cột trái là một cách. Làm thế nào để đảm bảo cột phải nằm cạnh cột trái và chiếm hết không gian còn lại mà không bị 'cuộn' dưới cột trái nếu nội dung cột trái dài hơn?

23 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 23: Thuộc tính `width` và `height` khi áp dụng cho các ô bảng (`

`, `

`) có thể bị ảnh hưởng bởi yếu tố nào sau đây?

24 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 24: Bạn muốn tạo một đường viền màu đỏ, nét đứt (dashed) cho một khối `div`. Đoạn CSS nào sau đây là đúng?

25 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 06

Câu 25: Để đặt màu nền cho toàn bộ phần thân bảng (`

` trong HTML dùng để thêm chú thích cho bảng. Bạn muốn chú thích này được căn giữa phía trên bảng. Bộ chọn CSS nào nhắm mục tiêu vào chú thích bảng?

Xem kết quả ` và bộ chọn CSS tương ứng. Thẻ `

` là một thẻ con trực tiếp của `

` và được sử dụng để cung cấp tiêu đề hoặc chú thích cho bảng.

`) trong bảng, bạn muốn thay đổi màu nền của hàng đó để cung cấp phản hồi trực quan. Bộ chọn giả (`pseudo-class`) nào được sử dụng để định kiểu cho trạng thái khi con trỏ chuột ở trên một phần tử?

:hover

:active

:focus

:visited

7 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 07

Câu 7: Xét đoạn mã CSS sau: `div { margin: 10px 20px; }`. Đoạn mã này sẽ tạo ra khoảng trống xung quanh phần tử `div`. Khoảng trống này sẽ là bao nhiêu ở phía trên (top) và bên phải (right)?

Trên 10px, Phải 10px

Trên 20px, Phải 10px

Trên 10px, Phải 20px

Trên 20px, Phải 20px

8 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 07

Câu 8: Bạn muốn tạo một khoảng đệm (khoảng trống bên trong) 15px cho tất cả các ô dữ liệu (`

`) trong một bảng, bạn sử dụng thuộc tính CSS nào?

width

height

line-height

vertical-align

20 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 07

Câu 20: Bạn muốn tạo một đường viền chỉ ở phía dưới cho mỗi ô tiêu đề (`

`) sao cho nó có màu nền xanh và chữ màu trắng để làm nổi bật. Bạn cần sử dụng những thuộc tính CSS nào để đạt được hiệu quả này?

font-color và background

color và background-color

text-color và fill

foreground và background

6 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 07

Câu 6: Khi người dùng di chuột qua một hàng cụ thể (`

`) và ô tiêu đề (`

`) trong bảng để nội dung không bị dính sát vào đường viền. Thuộc tính CSS nào được sử dụng để thiết lập khoảng đệm bên trong phần tử?

padding

margin

border-spacing

text-indent

9 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 07

Câu 9: Xét đoạn mã HTML và CSS sau:
HTML: `

Nội dung

`
CSS: `.box { width: 200px; padding: 20px; border: 5px solid black; }`
Tổng chiều rộng thực tế mà phần tử `div` này chiếm trên trang (bao gồm nội dung, padding và border) theo mô hình hộp CSS (box model) mặc định là bao nhiêu?

200px

220px

230px

250px

10 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 07

Câu 10: Bạn muốn căn giữa nội dung văn bản bên trong các ô tiêu đề (`

`) của bảng. Thuộc tính CSS nào được sử dụng để căn chỉnh nội dung văn bản theo chiều ngang?

text-align

vertical-align

align-items

justify-content

`) trong bảng có đường viền màu đỏ dày 2px kiểu nét liền. Bộ chọn và thuộc tính CSS nào sau đây *chỉ* áp dụng đường viền cho các ô dữ liệu?

table td { border: 2px solid red; }

td { border-width: 2px; border-style: solid; border-color: red; }

td { border: 2px solid red; }

Cả B và C đều đúng.

17 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 07

Câu 17: Xét tình huống bạn có một `div` lớn chứa một `div` nhỏ hơn đã được `float: left;`. Phần `div` lớn bị thu gọn chiều cao. Để phần `div` lớn 'mở rộng' ra để chứa `div` nhỏ đã float mà không cần thêm phần tử HTML phụ (`

`), bạn có thể áp dụng thuộc tính `overflow` với giá trị `hidden` hoặc `auto` cho phần tử cha. Tại sao kỹ thuật này lại hiệu quả?

Nó tạo ra một bối cảnh định dạng khối mới (New Block Formatting Context - BFC), buộc phần tử cha phải chứa tất cả các phần tử con đã float.

Nó ẩn phần nội dung bị tràn ra ngoài, do đó không cần 'clear'.

Nó tự động thêm thuộc tính `clear: both;` vào cuối phần tử cha.

Nó chuyển đổi phần tử cha thành một phần tử `inline-block`.

18 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 07

Câu 18: Bạn muốn căn giữa toàn bộ bảng HTML trên trang web (căn giữa theo chiều ngang). Nếu bảng có thuộc tính `display` là `block` (mặc định cho bảng), bạn có thể sử dụng kết hợp thuộc tính `margin` nào?

margin: center;

margin-left: auto; margin-right: auto;

margin: 0 auto;

text-align: center;

19 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 07

Câu 19: Để thiết lập chiều cao cố định là 50px cho tất cả các hàng (`

`) trong bảng. Thuộc tính CSS nào bạn sẽ sử dụng cho bộ chọn `th`?

border-bottom

border-top

border-left

border-right

`) trong bảng không có đường viền nào cả, bạn có thể sử dụng thuộc tính `border` với giá trị nào?

border: auto;

border: visible;

border: none;

border: collapse;

`) của bảng. Thuộc tính CSS nào được sử dụng cho mục đích này?

vertical-align

text-align

line-height

align-items

30 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 07

Câu 30: Để tạo một `div` có chiều rộng cố định 300px, màu nền xanh nhạt và đường viền nét đứt màu xám dày 1px, đoạn CSS nào sau đây là chính xác?

div { width=300px; background-color=lightblue; border=1px dashed gray; }

div { size: 300px; color: lightblue; outline: 1px dashed gray; }

div { width: 300px; background-color: lightblue; border: 1px dashed gray; }

div { width: 300; background: lightblue; border: dashed gray 1px; }

Xem kết quả

Bạn đã sẵn sàng chưa? 45 phút làm bài bắt đầu!!!

Bạn đã hết giờ làm bài! Xem kết quả các câu hỏi đã làm nhé!!!

Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

- Đề 08

1 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 08

Câu 1: Bạn muốn áp dụng một kiểu viền đơn dày 2px màu xanh dương cho toàn bộ bảng (`

`), các ô tiêu đề (`

`. Thuộc tính `background-color` được dùng để đặt màu nền.

3 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 08

Câu 3: Bạn có một bảng dữ liệu và muốn khi người dùng di chuột qua một hàng (`

`), màu nền của hàng đó sẽ thay đổi để dễ nhìn hơn. Lớp giả (`pseudo-class`) nào của CSS được sử dụng cho mục đích này?

:active

:focus

:nth-child()

:hover

4 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 08

Câu 4: Cho đoạn mã HTML và CSS sau:
```html

Nội dung 1

Nội dung 2

```
```css
.box1 { float: left; width: 50%; background-color: lightblue; }
.box2 { float: right; width: 50%; background-color: lightgreen; }
```
Khi hiển thị trên trình duyệt với đủ chiều rộng, bố cục của hai `div` này sẽ như thế nào?

Hai `div` sẽ nằm cạnh nhau trên cùng một hàng, `.box1` bên trái và `.box2` bên phải.

`.box1` sẽ nằm ở hàng trên, `.box2` sẽ nằm ở hàng dưới.

Hai `div` sẽ chồng lên nhau.

`.box1` nằm bên trái, `.box2` nằm bên phải, nhưng có khoảng trống lớn ở giữa.

5 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 08

Câu 5: Khi sử dụng thuộc tính `float` cho các phần tử `div`, đôi khi các phần tử đứng sau không 'nhận biết' được chiều cao của các phần tử đã float, dẫn đến bố cục bị sai lệch (ví dụ: nội dung bị tràn lên). Thuộc tính CSS nào thường được sử dụng để 'xóa' hiệu ứng `float` và khôi phục dòng chảy bố cục bình thường cho các phần tử sau?

overflow

position

clear

display

6 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 08

Câu 6: Bạn muốn căn giữa nội dung văn bản trong tất cả các ô dữ liệu (`

`), và các ô dữ liệu (`

`). Đoạn mã CSS nào sau đây thực hiện đúng yêu cầu đó một cách hiệu quả nhất?

table { border: 2px solid blue; } th, td { border: 2px solid blue; }

table { border-collapse: separate; border: 2px solid blue; } th, td { border: 2px solid blue; }

table { border-collapse: collapse; } table, th, td { border: 2px solid blue; }

table { border: 2px solid blue; border-collapse: collapse; } th, td { border: 2px solid blue; border-collapse: collapse; }

2 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 08

Câu 2: Để đặt màu nền cho các hàng chẵn (`even`) trong một bảng HTML thành màu xám nhạt (#f2f2f2), bạn sử dụng bộ chọn và thuộc tính CSS nào?

tr:nth-child(even) { background-color: #f2f2f2; }

tr:even { background-color: #f2f2f2; }

tr:nth-child(odd) { background-color: #f2f2f2; }

table tr:even { background-color: #f2f2f2; }

`) của một bảng. Thuộc tính CSS nào sau đây là phù hợp nhất?

vertical-align: middle;

text-align: center;

align-items: center;

justify-content: center;

7 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 08

Câu 7: Để tăng khoảng cách đệm (khoảng trống bên trong viền) cho tất cả các ô tiêu đề (`

`) và ô dữ liệu (`

`) trong một bảng, bạn sử dụng thuộc tính nào?

padding

margin

border-spacing

cell-spacing

8 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 08

Câu 8: Bạn đang thiết kế một bố cục gồm ba cột sử dụng các thẻ `div` và thuộc tính `float`. Mỗi cột có chiều rộng 33.33%. Để đảm bảo các cột này nằm cạnh nhau trên cùng một hàng, tổng chiều rộng của chúng (bao gồm `margin`, `padding`, `border`) phải nhỏ hơn hoặc bằng chiều rộng của phần tử chứa. Nếu bạn đặt `width: 33.33%;` cho mỗi `div` và thêm `padding` hoặc `border`, điều gì có khả năng xảy ra?

Các cột sẽ nằm cạnh nhau hoàn hảo.

Một hoặc nhiều cột có thể bị đẩy xuống hàng dưới do tổng chiều rộng vượt quá 100%.

Các cột sẽ tự động điều chỉnh chiều rộng để vừa khít trên một hàng.

Nội dung bên trong các cột sẽ bị tràn ra ngoài.

9 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 08

Câu 9: Để khắc phục vấn đề ở Câu 8 (khi `padding` hoặc `border` làm các cột `float` bị đẩy xuống hàng), bạn có thể sử dụng thuộc tính CSS nào để thay đổi cách tính toán mô hình hộp, khiến `width` bao gồm cả `padding` và `border`?

box-sizing: border-box;

box-sizing: content-box;

display: inline-block;

overflow: hidden;

10 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 08

Câu 10: Bạn có một bảng và muốn căn giữa bảng đó theo chiều ngang trên trang web. Thuộc tính CSS nào áp dụng cho thẻ `

` giúp thực hiện điều này khi bảng có chiều rộng cố định (ví dụ: `width: 80%;`)?

text-align: center;

align-items: center;

float: center;

margin: 0 auto;

` hoặc chỉ là các thẻ `

`) của bảng thành màu trắng, bạn sử dụng thuộc tính nào?

color

text-color

font-color

background-color

`) có màu nền riêng biệt so với các hàng dữ liệu. Bộ chọn CSS nào sau đây là phù hợp nhất để chỉ định kiểu cho hàng tiêu đề?

tr:first-child th

td:first-child

table tr th

` ở đầu bảng.

25 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 08

Câu 25: Bạn có một `div` và muốn nó hiển thị như một phần tử khối (block element) nhưng chỉ chiếm không gian vừa đủ theo nội dung của nó, giống như phần tử nội tuyến (inline element) khi không có chiều rộng/cao được đặt rõ ràng. Tuy nhiên, bạn vẫn muốn có thể đặt chiều rộng và chiều cao cho nó. Kiểu hiển thị (`display`) nào phù hợp?

display: inline-block;

display: inline;

display: block;

display: flex;

26 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 08

Câu 26: Để làm cho văn bản trong các ô tiêu đề (`

`) của bảng được in đậm và căn giữa theo mặc định, trình duyệt thường áp dụng kiểu nào?

font-weight: normal; text-align: left;

font-weight: bold; text-align: left;

font-weight: normal; text-align: center;

font-weight: bold; text-align: center;

` được in đậm (`font-weight: bold;`) và căn giữa theo chiều ngang (`text-align: center;`).

` và `

` về mặt ngữ nghĩa và mặc định hiển thị của trình duyệt là gì?

`<th>` là ô tiêu đề (in đậm, căn giữa), `<td>` là ô dữ liệu (bình thường, căn trái).

`<th>` là ô dữ liệu, `<td>` là ô tiêu đề.

Cả hai đều là ô dữ liệu nhưng `<th>` dùng cho hàng đầu tiên.

Cả hai đều là ô tiêu đề nhưng `<td>` dùng cho cột đầu tiên.

Xem kết quả

` (table header) dùng cho các ô tiêu đề, mang ý nghĩa ngữ nghĩa là đầu đề của cột hoặc hàng. Trình duyệt mặc định in đậm và căn giữa nội dung của `

`. `

` (table data) dùng cho các ô dữ liệu thông thường, nội dung thường hiển thị bình thường và căn trái theo mặc định.

Bạn đã sẵn sàng chưa? 45 phút làm bài bắt đầu!!!

Bạn đã hết giờ làm bài! Xem kết quả các câu hỏi đã làm nhé!!!

Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

- Đề 09

1 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 09

Câu 1: Bạn muốn thiết lập cho các đường viền của bảng (table) và các ô (td, th) trong bảng được gộp lại thành một đường viền duy nhất thay vì hiển thị đường viền đôi. Thuộc tính CSS nào bạn cần sử dụng cho phần tử `

` để đạt được điều này?

border-spacing: 0;

border-style: collapse;

border-collapse: collapse;

border: none;

` để kiểm soát cách hiển thị đường viền giữa các ô. Giá trị `collapse` sẽ gộp các đường viền liền kề thành một đường viền đơn.

2 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 09

Câu 2: Để thêm khoảng trống giữa nội dung bên trong và đường viền của mỗi ô dữ liệu (`

`) nằm ở vị trí chẵn trong danh sách các phần tử cùng cấp. Kết hợp với `background-color`, bạn có thể định màu nền riêng cho các hàng chẵn.

4 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 09

Câu 4: Khi áp dụng `border: 1px solid black;` cho cả phần tử `

`) và ô tiêu đề (`

`) trong bảng, bạn nên sử dụng thuộc tính CSS nào?

margin

padding

spacing

text-indent

3 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 09

Câu 3: Bạn muốn thiết lập màu nền xen kẽ cho các hàng trong bảng để dễ đọc hơn, cụ thể là đặt màu nền nhạt cho các hàng chẵn. Selector và thuộc tính CSS nào là phù hợp nhất?

tr.even { background-color: #f2f2f2; }

tr:odd { background-color: #f2f2f2; }

tr:nth-child(odd) { background-color: #f2f2f2; }

tr:nth-child(even) { background-color: #f2f2f2; }

`, `

`) trong bảng, bạn sẽ sử dụng lớp giả (pseudo-class) nào?

:active

:focus

:hover

:visited

`, và `	` mà không sử dụng `border-collapse: collapse;`, hiện tượng gì thường xảy ra với đường viền giữa các ô? Đường viền giữa các ô sẽ hiển thị dưới dạng đường viền đôi. Chỉ đường viền ngoài cùng của bảng được hiển thị. Các đường viền sẽ tự động gộp lại thành đường đơn. Các ô sẽ không có đường viền nào cả. Theo mặc định (khi `border-collapse` là `separate`), mỗi ô bảng có đường viền riêng của nó. Khi các ô nằm cạnh nhau, đường viền của ô này và đường viền của ô kia sẽ hiển thị cạnh nhau, tạo ra hiệu ứng đường viền đôi. 5 / 30 Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử Tags: Bộ đề 09 Câu 5: Bạn muốn định kiểu cho hàng tiêu đề của bảng (`	`) để nó có màu nền đậm và chữ màu sáng, giúp phân biệt rõ với phần nội dung. Selector CSS nào sau đây nhắm đúng vào các ô tiêu đề? tr:first-child th thead table > tr:first-child Selector `th` nhắm trực tiếp vào tất cả các phần tử ô tiêu đề trong bảng. Từ đó, bạn có thể áp dụng các thuộc tính như `background-color` và `color` để định kiểu. 6 / 30 Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử Tags: Bộ đề 09 Câu 6: Để tạo hiệu ứng thay đổi màu nền hoặc màu chữ khi người dùng di chuyển con trỏ chuột qua một hàng bất kỳ (`

`, bạn sẽ sử dụng cú pháp CSS nào?

table { border: 1px solid blue; }

table { border-color: blue; border-style: solid; border-width: 1px; }

table { border-line: 1px solid blue; }

table { border-style: 1px solid blue; }

11 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 09

Câu 11: Bạn có một bảng được định kiểu với `border-collapse: collapse;`. Bạn áp dụng `border: 2px solid red;` cho phần tử `

` và `border: 1px solid blue;` cho các phần tử `

`). Giả sử các hàng nội dung nằm trong `

`. Selector nào có thể giúp bạn làm điều này?

tr:first-child

table tr:first-child

tbody tr:first-child

tr:nth-child(1)

`) là phần tử con đầu tiên của phần tử `

`. Điều này giúp chọn hàng đầu tiên của phần nội dung, loại trừ hàng tiêu đề trong `

` và `

`. Đường viền *giữa* các ô sẽ có màu gì và độ dày bao nhiêu?

Màu đỏ, độ dày 2px.

Màu xanh, độ dày 1px.

Màu đỏ, độ dày 1px.

Màu xanh, độ dày 2px.

12 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 09

Câu 12: Để căn chỉnh văn bản trong tất cả các ô dữ liệu (`

`) của bảng sang bên phải, bạn sử dụng thuộc tính CSS nào với giá trị tương ứng?

text-align: right;

align: right;

vertical-align: right;

float: right;

`) trong bảng. Thuộc tính CSS nào cho phép bạn chỉ định kiểu cho một cạnh cụ thể?

border-side

border-edge

border-bottom

border-line-bottom

`, `

`) để căn chỉnh nội dung theo chiều dọc.

24 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 09

Câu 24: Bạn muốn tạo khoảng cách 20px ở phía trên và phía dưới của một khối `

` cụ thể có class là 'section'. Cú pháp CSS nào là đúng?

.section { margin-top: 20px; margin-bottom: 20px; }

.section { padding-top: 20px; padding-bottom: 20px; }

.section { border-top: 20px; border-bottom: 20px; }

.section { clear: both; }

25 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 09

Câu 25: Bạn có một bảng và muốn tất cả văn bản trong các ô dữ liệu (`

`) có màu đỏ. Selector và thuộc tính nào là phù hợp?

table { color: red; }

tr { color: red; }

td { color: red; }

table td { background-color: red; }

26 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 09

Câu 26: Để làm tròn các góc của một khối `

`, bạn sử dụng thuộc tính CSS nào?

border-radius

corner-radius

border-style: rounded

shape-outside

27 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 09

Câu 27: Bạn có một bảng với `border-collapse: separate;` và thiết lập `border-spacing: 10px;`. Điều này có ý nghĩa gì đối với hiển thị của bảng?

Các ô sẽ không có khoảng cách giữa chúng.

Sẽ có khoảng cách 10px giữa các ô trong bảng.

Đường viền của bảng sẽ dày 10px.

Chỉ có khoảng cách 10px ở lề ngoài của bảng.

28 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 09

Câu 28: Bạn muốn áp dụng một kiểu viền (ví dụ: nét đứt) cho tất cả các ô dữ liệu (`

`) và ô tiêu đề (`

`) trong bảng. Selector và thuộc tính nào là phù hợp?

table td, th { border-style: dashed; }

td-th { border-style: dashed; }

.table-cells { border-style: dashed; }

td, th { border-style: dashed; }

29 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 09

Câu 29: Khi bạn áp dụng `float` cho tất cả các phần tử con bên trong một phần tử `

` cha mà không có nội dung không float nào khác bên trong phần tử cha đó, điều gì có thể xảy ra với chiều cao của phần tử `

` cha theo mặc định?

Phần tử cha có thể bị sụp đổ chiều cao (chiều cao trở về 0 hoặc rất nhỏ).

Phần tử cha sẽ tự động điều chỉnh chiều cao để chứa tất cả các phần tử con float.

Phần tử cha sẽ có chiều cao cố định là 100%.

Các phần tử con float sẽ bị ẩn đi.

30 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 09

Câu 30: Để thiết lập độ dày đường viền cho tất cả các cạnh của một khối `

` là 2px, màu là đen, và kiểu là nét liền, bạn sử dụng thuộc tính viết tắt nào?

border-width: 2px; border-style: solid; border-color: black;

border: 2px solid black;

border-style: 2px solid black;

border-line: 2px solid black;

Xem kết quả

Bạn đã sẵn sàng chưa? 45 phút làm bài bắt đầu!!!

Bạn đã hết giờ làm bài! Xem kết quả các câu hỏi đã làm nhé!!!

Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

- Đề 10

1 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 10

Câu 1: Trong CSS, để loại bỏ khoảng cách giữa các đường viền của các ô (cell) trong bảng và hiển thị đường viền đơn duy nhất, bạn sử dụng thuộc tính nào cho thẻ `

border-spacing

border-style

border-collapse

padding

2 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 10

Câu 2: Bạn muốn thêm khoảng trắng bên trong mỗi ô dữ liệu (`

` hoặc các ô `

` hoặc chứa các ô `

`) và ô tiêu đề (`

`) của bảng để nội dung không bị dính sát vào đường viền. Thuộc tính CSS nào phù hợp nhất để thực hiện điều này?

margin

border

spacing

padding

3 / 30

Category: Bài Tập Trắc nghiệm Tin học 12 - Chân trời sáng tạo - Bài F11: Định kiểu CSS cho bảng và phần tử

Tags: Bộ đề 10

Câu 3: Để đặt màu nền khác biệt cho hàng tiêu đề (`

` trong hàng đầu tiên) của bảng so với các hàng dữ liệu, bạn thường áp dụng thuộc tính `background-color` cho bộ chọn CSS nào?

table

tr:nth-child(odd)

`. Áp dụng CSS cho bộ chọn `th` hoặc một lớp (class) cho hàng tiêu đề là cách phổ biến để định kiểu riêng cho phần này.

` và `

`)?

padding

border-spacing

margin

cell-spacing

Đề Trắc nghiệm Tin học 12 – Bài F11: Định kiểu CSS cho bảng và phần tử
(Chân Trời Sáng Tạo)

Đề 01

Đề 02

Đề 03

Đề 04

Đề 05

Đề 06

Đề 07

Đề 08

Đề 09

Đề 10

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

`) nằm ngay bên cạnh một hình ảnh đã được `float: left;`. CSS nào áp dụng cho tiêu đề giúp nó hiển thị đúng vị trí và 'quấn' xung quanh hình ảnh?

`) theo sau trong luồng tài liệu sẽ tự động 'quấn' xung quanh phần tử float đó. Không cần áp dụng thuộc tính đặc biệt cho tiêu đề, bố cục 'quấn' là hành vi mặc định.

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Đề 01

Đề 02

Đề 03

Đề 04

Đề 05

Đề 06

Đề 07

Đề 08

Đề 09

Đề 10

Bạn ơi!!! Để xem được kết quảbạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quảbạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quảbạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quảbạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quảbạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quảbạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quảbạn vui lòng làm nhiệm vụ nhỏ xíu này nha

`) nằm ngay bên cạnh một hình ảnh đã được `float: left;`. CSS nào áp dụng cho tiêu đề giúp nó hiển thị đúng vị trí và 'quấn' xung quanh hình ảnh?

`) theo sau trong luồng tài liệu sẽ tự động 'quấn' xung quanh phần tử float đó. Không cần áp dụng thuộc tính đặc biệt cho tiêu đề, bố cục 'quấn' là hành vi mặc định.

Bạn ơi!!! Để xem được kết quảbạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quảbạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quảbạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Đề trắc nghiệm liên quan:

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha

Bạn ơi!!! Để xem được kết quả
bạn vui lòng làm nhiệm vụ nhỏ xíu này nha