تحدي المراجعة #1

جزء من قسم Styling with CSS في رحلة HTML على Coddy — الدرس 29 من 76.

التحدي

سهل

الآن بعد أن أتقنت تقنيات متنوعة لتنسيق النصوص والخلفيات باستخدام CSS، حان الوقت لاختبار معرفتك بتحدٍ شامل. ستقوم بتطبيق ما تعلمته عن الألوان، وأكواد الـ hex، وقيم RGB، والشفافية باستخدام RGBA لإنشاء تصميم محدد.

لقد تم تزويدك بمستند HTML يحتوي على عنوان (<h1>)، وفقرة (<p>)، وقسم (<div>). مهمتك هي استخدام خصائص تنسيق النص والخلفية التي تعلمتها لتنسيق هذه العناصر لتطابق التصميم الموضح في الصورة أدناه:

اتبع الخطوات أدناه:

اكتب قاعدة CSS تستهدف عنصر <h1>. قم بتعيين color إلى white، و background-color إلى #000080 (أزرق داكن)، و text-align إلى center.
اكتب قاعدة CSS تستهدف عنصر <p>. قم بتعيين color إلى #FFFFFF (أبيض)، و background-color إلى rgba(0, 0, 0, 0.5) (أسود شبه شفاف)، و font-size إلى 18px.
اكتب قاعدة CSS تستهدف عنصر <div>. قم بتعيين background-color إلى rgba(237, 170, 26, 1) (أصفر ذهبي) و color إلى white.

جرّب بنفسك

<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>