Up5me
Trang chủ > Câu hỏi lẻ > o9VDslPHaHBD

Đề bài

Để đặt padding trên và dưới cùng bằng 2epx và bo góc có bán kính 20px cho các hình ảnh đặt trong phần tử HTML trên, cách khai báo nào sau đây là chính xác?

.image- style img { padding: 20px 0px; border-radius: 20px; }
image-style .img { padding: 20px 0px; border-radius: 20px; }
#image-style ing { padding-top: 20px; padding-bottom: 20px; border-radius: 20px; }
.image-style img { padding: 0px 20px; border-radius: 20px;}
Đáp án đúng: A

Xem lời giải

Phương pháp giải

Lời giải chi tiết

Trước tiên, chúng ta cần phân tích yêu cầu đề bài:

  • Padding trên và dưới là 2px cho các hình ảnh.
  • Bán kính bo góc là 20px cho hình ảnh.

Như vậy, chúng ta cần khai báo trong CSS thuộc tính padding-toppadding-bottom với giá trị 2px, đồng thời sử dụng border-radius để bo góc cho hình ảnh.

Ta sẽ phân tích các tùy chọn:

  • A. .image- style img { padding: 20px 0px; border-radius: 20px; }: Kích thước padding cho trên và dưới là 20px, không đáp ứng yêu cầu 2px.
    Sai.
  • B. image-style .img { padding: 20px 0px; border-radius: 20px; }: Tương tự làm padding trên và dưới là 20px. Hơn nữa, selector không chọn đúng hình ảnh do không có dấu cách giữa class và phần tử (img thay vì .img), nên không thể áp dụng styling chính xác.
    Sai.
  • C. #image-style ing { padding-top: 20px; padding-bottom: 20px; border-radius: 20px; }: Cách chọn selector không chính xác và giá trị padding-top và padding-bottom là 20px thay vì 2px. Thêm vào đó là lỗi gõ sai từ khóa img.
    Sai.
  • D. .image-style img { padding: 0px 20px; border-radius: 20px;}: Điều này chỉ đặt padding trái và phải là 20px, không phải trên và dưới như yêu cầu.
    Sai.

Nhìn vào các phân tích trên, rõ ràng chưa có lựa chọn nào thực sự chính xác theo cách chọn lớp và từ khóa yêu cầu. Do đó, cách khai báo đúng theo yêu cầu đánh giá trên có thể hiểu nhầm.

Chú ý khi giải

Khi làm bài tập này, học sinh cần lưu ý:

  • Cách chọn selector CSS sao cho đúng, dựa trên tên class hoặc id được chỉ định chính xác.
  • Hiểu rõ cách hoạt động của padding CSS, với cú pháp padding-top, padding-right, padding-bottom, padding-left để chỉ định cụ thể khoảng cách của các hướng.
  • Chú ý lỗi chính tả hoặc cú pháp trong trình bày mã CSS, như img không nhầm với .img hay tpháp viết khoáng cách giữa các từ.