Thử thách ôn tập số 1

Thuộc phần Tạo kiểu với CSS trong hành trình HTML của Coddy. Bài học 29 trên 76.

Thử thách

Dễ

Giờ đây, khi đã thành thạo nhiều kỹ thuật định dạng văn bản và nền bằng CSS, bạn có thể thử sức với một thử thách tổng hợp để kiểm tra kiến thức của mình. Bạn sẽ áp dụng những gì đã học về màu sắc, mã hex, giá trị RGB và độ trong suốt bằng RGBA để tạo ra một thiết kế cụ thể.

Bạn được cung cấp một tài liệu HTML có tiêu đề (<h1>), một đoạn văn (<p>) và một phần tử phân vùng (<div>). Hãy dùng các thuộc tính định dạng văn bản và nền đã học để định dạng những phần tử này sao cho khớp với thiết kế trong hình bên dưới:

Thực hiện theo các bước dưới đây:

Viết một quy tắc CSS áp dụng cho phần tử <h1>. Đặt color thành white, background-color thành #000080 (xanh nước biển đậm) và text-align thành center.
Viết một quy tắc CSS áp dụng cho phần tử <p>. Đặt color thành #FFFFFF (trắng), background-color thành rgba(0, 0, 0, 0.5) (đen bán trong suốt) và font-size thành 18px.
Viết một quy tắc CSS áp dụng cho phần tử <div>. Đặt background-color thành rgba(237, 170, 26, 1) (vàng ánh kim) và color thành white.

Tự làm thử

<html>
<head>
    <title>Recap Challenge #1</title>
    <style>
        /* Write CSS rules here */
    </style>
</head>
<body>
    <h1>This is a heading</h1>
    <p>This is a paragraph.</p>
    <div>This is a division.</div>
</body>
</html>