تحدي المراجعة رقم 2
جزء من قسم Styling with CSS في رحلة HTML على Coddy — الدرس 24 من 76.
التحدي
سهلفي تحدي المراجعة الثاني هذا، ستطبق معرفتك بخصائص تنسيق النصوص في CSS لإعادة إنشاء تصميم محدد. سيختبر هذا التحدي قدرتك على دمج خصائص النص المختلفة، مثل color، و font-family، و font-size، و font-weight، و text-align، و text-decoration، لمطابقة تصميم معين.
لقد تم تزويدك بمستند HTML يحتوي على عنوان (<h1>)، وفقرة (<p>)، ورابط (<a>)، وقائمة غير مرتبة (<ul>) مع عناصر قائمة (<li>). مهمتك هي استخدام خصائص تنسيق النصوص التي تعلمتها لتنسيق هذه العناصر لتطابق التصميم الموضح في الصورة أدناه:

اتبع الخطوات أدناه:
- اكتب قاعدة CSS تستهدف عنصر
<h1>. قم بتعيينcolorإلىblack، وfont-familyإلى"Times New Roman", Times, serif، وfont-sizeإلى48px، وfont-weightإلىbold، وtext-alignإلىcenter. - اكتب قاعدة CSS تستهدف عنصر
<p>. قم بتعيينcolorإلىgray، وfont-familyإلىArial, Helvetica, sans-serif، وfont-sizeإلى18px، وtext-alignإلىcenter. - اكتب قاعدة CSS تستهدف عنصر
<a>. قم بتعيينcolorإلىred، وtext-decorationإلىnone. - اكتب قاعدة 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
4أساسيات النصوص
لون النصعائلة الخطحجم الخطسمك الخطمحاذاة النصزخرفة النصتحدي المراجعة رقم 1تحدي المراجعة رقم 27نموذج الصندوق - الجزء الأول
ما هو نموذج الصندوق؟المسافات الداخلية (Padding)الهوامش (Margins)الحدود (Borders)العرض والارتفاعتحدي المراجعة8نموذج الصندوق (Box Model) - الجزء الثاني
تحجيم الصندوق (Box Sizing)حواف العناصر (Border Radius)التدفق الزائد (Overflow)ظل الصندوق (Box Shadow)تحدي المراجعة