CSS/תחביר כללי/תרגילים

מתוך ויקיספר, אוסף הספרים והמדריכים החופשי
קפיצה לניווט קפיצה לחיפוש

בדף זה 5 שאלות בנושא תחביר CSS.

שאלה 1[עריכה]

בדף HTML העושה שימוש בגיליון ה־CSS הבא, איזה טקסט ייכתב בגופן גדול יותר: זה הנמצא בטבלה או זה הנמצא בכותרת?

table {
  font-size: 50px;
}

h1 {
  font-size: 100px;
}


שאלה 2[עריכה]

בדף HTML העושה שימוש בגיליון ה־CSS הבא, איזה טקסט ייכתב בגופן גדול יותר: זה הנמצא בטבלה או זה הנמצא בכותרת?

table {
  font-size: 50px;
}

h1, table h1 {
  font-size: 100px;
}


שאלה 3[עריכה]

בדף HTML העושה שימוש בגיליון ה־CSS הבא, איזה טקסט ייכתב בגופן גדול יותר: זה הנמצא בטבלה או זה הנמצא בכותרת?

table {
  font-size: 50px;
}

h1, table#nav h1 {
  font-size: 100px;
}


שאלה 4[עריכה]

מה יהיה צבע הגופן של כל אחד מהקישורים שבדף ה־HTML הבא?

<html>
.
.
.
  <div id="navigation-bar">
    <h3><a href="..." title="Main Page" class="nav-links">Main Page</a></h3>
    <div id="box1">
      <p><a href="..." title="link1" class="nav-links">link1</a></p>
    </div>
    <div id="box2">
      <p><a href="..." title="link2" class="nav-links">link2</a></p>
    </div>
  </div>
.
.
.
</html>
a.nav-links {
  color: blue;
}

div h3 a {
  color: red;
}

#box1 p .nav-links {
  color: black;
}

div#box2 p a.nav-links {
  color: green;
}


שאלה 5[עריכה]

מה יהיה צבעו של כל פרק בתוכן העניינים?

<html>
.
.
.
  <table class="table-of-contents">
    <tr>
      <td>
        <div class="colored-text">Chapter 1</div>
      </td>
    </tr>
    <tr>
      <td>
        <span class="colored-text">Chapter 2</span>
      </td>
    </tr>
  </table>

  <div class="table-of-contents">
    <p><div class="colored-text">Chapter 3</div></p>
    <p><span class="colored-text">Chapter 4</span></p>
  </div>
.
.
.
</html>
.table-of-contents div.colored-text {
  color: black;
}

.table-of-contents span.colored-text {
  color: red;
}