Bộ 3 đề thi giữa kì 2 Tin học 12 Chân trời sáng tạo có đáp án (Đề 1)
20 câu hỏi
Nếu một phần tử có CSS là {width: 300px; padding: 10px; border: 2px solid black;}, chiều rộng thực tế hiển thị trên trang là bao nhiêu?
300px.
320px.
324px.
330px.
Chọn C
300px + 10px padding trái + 10px padding phải + 2px border trái + 2px border phải = 324px
Đoạn mã <ul><li>A</li><li style="list-style-type: none;" >B</li> <li>C</li> </ul> sẽ hiển thị như thế nào?
Cả 3 mục đều có dấu đầu dòng.
Chỉ mục B không có dấu đầu dòng.
Chỉ mục A và C không có dấu đầu dòng.
Không mục nào có dấu đầu dòng.
Chọn B
Ưu tiên áp dụng CSS nội tuyến
Trong biểu mẫu <form><input type="checkbox" name="hobby" value="1"> <input type="checkbox" name="hobby" value="2"></form>, nếu chọn cả hai ô, dữ liệu gửi đi sẽ là gì?
hobby=1.
hobby=2.
hobby=1&hobby=2.
Không gửi được dữ liệu.
Chọn C
Một phần tử có CSS {position: relative; top: 20px; left: 30px;} sẽ dịch chuyển như thế nào so với vị trí ban đầu?
Xuống 20px, sang trái 30px.
Xuống 20px, sang phải 30px.
Lên 20px, sang phải 30px.
Không dịch chuyển.
Chọn B
Hiểu cách position: relative hoạt động
Nếu <body> có thẻ <p> bên trong có ch thước chữ của <p> là bao nhiêu pixel?
10px.
20px.
25px.
30px.
Chọn B
Đoạn mã <a href="#">Click</a> khi nhấp vào sẽ làm gì
Tải lại trang hiện tại.
Mở trang mới trắng.
Không làm gì ngoài nhảy lên đầu trang.
Báo lỗi.
Chọn C
Trong CSS, nếu một phần tử có giá trị các thuộc tính {display: inline; width: 100px;}, điều gì sẽ xảy ra?
Phần tử có chiều rộng 100px và nằm ngang.
Thuộc tính width bị bỏ qua.
Phần tử chuyển thành block.
Phần tử bị ẩn.
Chọn B
Phần tử loại inline không áp dụng thuộc tính width.
Thẻ <table> trong HTML dùng để làm gì?
Tạo bảng.
Tạo biểu mẫu.
Chèn hình ảnh.
Định dạng văn bản.
Chọn A
Thuộc tính nào sau đây của thẻ <img> dùng để chỉ định đường dẫn tới hình ảnh
alt.
height.
width.
src.
Chọn D
Thẻ nào sau đây dùng để tạo liên kết trong trang web?
<link>.
<a>.
<href>.
<url>.
Chọn B
Thẻ <form> trong HTML có tác dụng gì?
Tạo biểu mẫu nhập liệu.
Tạo bảng.
Chèn video.
Định dạng đoạn văn.
Chọn A
Thuộc tính colspan trong thẻ <td> dùng để làm gì?
Gộp hàng.
Chèn hình ảnh.
Định dạng chữ.
Gộp cột.
Chọn D
Thí sinh trả lời từ câu 1 đến câu 2. Trong mỗi ý a), b), c), d) ở mỗi câu, thí sinh chọn đúng hoặc sai. Mỗi câu 1 điểm (4 ý đúng, mỗi ý 0.25 đ)
Một học sinh tạo trang web bằng đoạn mã sau. Em hãy xác định xem nhận định sau đây là đúng hay sai:
<style>
.container { width: 400px; border: 1px solid red; }
.item { width: 50%; margin: 10px; }
</style>
<divclass="container">
<divclass="item">Nội dung</div>
</div>
a) Chiều rộng của .item là 200px.
b) Dòng chữ “Nội dung” sẽ được áp dụng màu đỏ.
c) Nếu .container có thêm padding: 20px, chiều rộng của .item sẽ giảm xuống 180px.
d) .contaniner là bộ chọn mã định danh.
a | Đ | a) 50% của 400px = 200px b) Dòng chữ nội dung áp dụng màu chữ mặc định là màu đen. c) (50% của (400px - 20px trái - 20px phải) = 180px). d) .contaniner là bộ chọn lớp. |
b | S | |
c | Đ | |
d | S |
Một học sinh đang thiết kế trang web và viết đoạn mã HTML như sau:
<tableborder="1">
<tr>
<td colspan="2">Tiêu đề</td>
</tr>
<tr>
<td>Nội dung 1</td>
<td>Nội dung 2</td>
</tr>
</table>
a) Bảng trên có 2 hàng và 3 cột.
b) Thuộc tính border="1" sẽ tạo đường viền cho bảng.
c) CSS được sử dụng trong đoạn lệnh trên là CSS internal.
d) Giá trị border có thể chỉ định kiểu viền, độ dày và màu sắc cùng một lúc.
a | S | Sai (Bảng có 2 hàng nhưng dòng 1 có 1 cột và dòng 2 có 2 cột, do thẻ colspan="2" gộp 2 cột ở hàng đầu tiên |
b | Đ | |
c | S | Đoạn lệnh sử dụng CSS inline. |
d | Đ |
Một bảng có 3 hàng và 3 cột, hàng thứ hai có <td colspan="3">, tổng số ô thực tế của bảng là bao nhiêu?
7 | Vì hàng thứ 2 có 3 ô bị gộp làm 1 ô. |
Nếu <body> có thẻ <div> bên trong có ch thước chữ trong <div> là bao nhiêu pixel?
20 | 20 (16px × 1.25 = 20px). |
Một phần tử có mã CSS là {width: 150px; padding: 5px; border: 3px solid;}, chiều rộng thực tế hiển thị là bao nhiêu?
166 | (150px + 5px × 2 + 3px × 2 = 166px). |
Số lượng ký tự tối đa có thể nhập vào ô <input type="text" maxlength="5"> là bao nhiêu?
5 | Vì maxlength="5" |
So sánh sự khác nhau giữa HTML và CSS về chức năng và vai trò trong thiết kế web.
Ví dụ:
<!DOCTYPE html> <html lang="vi"> <head> <title>Ví dụ HTML & CSS</title> <link rel="stylesheet" href="style.css"> </head> <body> <h1>Chào mừng đến với website của tôi!</h1> <p>Đây là một đoạn văn bản.</p> </body> </html>
h1 { color: blue; text-align: center; } p {
color: gray; } |
Viết đoạn mã HTML và CSS để tạo một trang web gồm:
Một tiêu đề cấp 2 "Danh sách sở thích" với màu xanh lá, căn giữa, và kích thước chữ 150% so với mặc định của <body> (giả sử 16px).
Một danh sách có thứ tự gồm 3 mục, với dấu đầu dòng là số La Mã (I, II, III).
<!DOCTYPE html>
<html>
<head>
<title>Sở thích</title>
<style>
body { color: #000000; background-color: transparent; font-weight: 400; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">: 16px; }
h2 {
color: green;
text-align: center;
color: #000000; background-color: transparent; font-weight: 400; font-style: normal; font-variant: normal; text-decoration: none; vertical-align: baseline; white-space: pre-wrap;">: 1.5em; /* 24px */
}
ol {
list-style-type: upper-roman;
}
</style>
</head>
<body>
<h2>Danh sách sở thích</h2>
<ol>
<li>Đọc sách</li>
<li>Nghe nhạc</li>
<li>Xem phim</li>
</ol>
</body>
</html>
