אתגר סיכום #1
חלק מהיחידה עיצוב באמצעות CSS במסלול ה-HTML של Coddy. שיעור 23 מתוך 76.
אתגר
קלבאתגר הסיכום הראשון הזה תיישמו את הידע שלכם במאפייני עיצוב טקסט ב-CSS כדי ליצור מחדש עיצוב מסוים. האתגר יבחן את היכולת שלכם לשלב מגוון מאפייני טקסט, כגון color, font-family, font-size, font-weight, text-align ו-text-decoration.
ניתן לכם מסמך HTML עם מגוון רכיבים. המשימה שלכם היא להחיל על הרכיבים האלה מאפיינים שונים שלמדתם ביחידה הזאת כדי לעצב אותם. בצעו את השלבים הבאים:
- כתבו כלל CSS שמכוון לכל רכיבי
<h1>.- הגדירו את הצבע לכחול כהה.
- הגדירו את גודל הגופן ל-32px.
- הגדירו את משקל הגופן ל-bold.
- הגדירו את יישור הטקסט למרכז.
- כתבו כלל CSS שמכוון לכל הרכיבים עם המחלקה
intro-text.- הגדירו את הצבע לאפור.
- הגדירו את font-family ל-
Arial, Helvetica, sans-serif; - הגדירו את גודל הגופן ל-18px.
- כתבו כלל CSS שמכוון לכל רכיבי
<li>.- הגדירו את font-weight ל-600.
- כתבו כלל CSS שמכוון לכל רכיבי
<a>.- הגדירו את text-decoration ל-none.
- הגדירו את הגופן ל-font-family המועדף עליכם:
"Times New Roman", Times, serif.
נסו בעצמכם
<html>
<head>
<title>Recap Challenge #1</title>
<style>
/* Write CSS rules here */
</style>
</head>
<body>
<h1>Discovering the Ocean</h1>
<p class="intro-text">The ocean covers 70% of the Earth's surface and is full of life. It also helps regulate the planet's climate.</p>
<h2>Marine Life</h2>
<ul>
<li>Whales</li>
<li>Octopuses</li>
<li>Coral Reefs</li>
</ul>
<p>Learn more at <a href="https://www.oceans.org" target="_blank">The Ocean Conservation Society</a>.</p>
</body>
</html>
כל השיעורים ביחידה עיצוב באמצעות CSS
4יסודות הטקסט
צבע הטקסטמשפחת גופניםגודל הגופןעובי הגופןיישור הטקסטעיטור הטקסטאתגר סיכום #1אתגר סיכום #2תרגלו בעצמכם: Web אונליין