Menu
Coddy logo textTech
flag Ar iconالعربيةdown icon

تحدي المراجعة رقم 2

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

challenge icon

التحدي

سهل

في تحدي المراجعة الثاني هذا، ستطبق معرفتك بخصائص تنسيق النصوص في CSS لإعادة إنشاء تصميم محدد. سيختبر هذا التحدي قدرتك على دمج خصائص النص المختلفة، مثل color، و font-family، و font-size، و font-weight، و text-align، و text-decoration، لمطابقة تصميم معين. 

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

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

  1. اكتب قاعدة CSS تستهدف عنصر <h1>. قم بتعيين color إلى black، و font-family إلى "Times New Roman", Times, serif، و font-size إلى 48px، و font-weight إلى bold، و text-align إلى center.
  2. اكتب قاعدة CSS تستهدف عنصر <p>. قم بتعيين color إلى gray، و font-family إلى Arial, Helvetica, sans-serif، و font-size إلى 18px، و text-align إلى center.
  3. اكتب قاعدة CSS تستهدف عنصر <a>. قم بتعيين color إلى red، و text-decoration إلى none.
  4. اكتب قاعدة CSS تستهدف جميع عناصر <li>. قم بتعيين color إلى green، و font-family إلى "Courier New", Courier, monospace، و font-size إلى 25px، و font-weight إلى 600.

جرّب بنفسك

<html>
<head>
    <title>Recap Challenge #2</title>
    <style>
        /* Write CSS rules here */
    </style>
</head>
<body>
    <h1>This is a heading</h1>
    <p>This is a paragraph with a <a href="#">link</a>.</p>
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
    </ul>
</body>
</html>

جميع دروس Styling with CSS