CSS/מיקום

< CSS

ישנם שני סוגים של מיקום:

  • מיקום מוחלט.
  • מיקום יחסי.

מיקום מוחלט מסמנים כך: position: absolute;. מיקום יחסי מסמנים כך : position: relative;.

המוחלט והיחסיעריכה

המיקום המוחלט והמיקום היחסי הם די דומים , שניהם מצויינים ע"י אותה שורת קוד , אך ההבדל העיקרי הוא חישוב המקום. האופן שבו המחשב מחשב את המיקום באופן "מוחלט" הוא להניח את האלמנט במקום המצויין ללא בעיות.

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

הכל תלוי במקרה.

שורת הקוד - מוחלטעריכה

#two {
position: absolute;
top: 180px;
left: 70px;
}

שורת הקוד - יחסיעריכה

#three {
position: relative;
top: 180px;
left: 70px;
}

אפשרויות מילויעריכה

  • top
  • right
  • left
  • bottom

דוגמא מלאהעריכה

<html>
<head>
<style type="text/css">
p.revah
{
position:absolute;
top: 300px;
left: 500px;
}
</style>
</head>

<body>
<p>פיסקה זאת היא רגילה</p>
<p class="revah">פיסקה זאת ממוקדת</p>
<p>פיסקה זאת היא רגילה</p>
</body>

</html>


הפרק הקודם:
קישורים
מיקום הפרק הבא:
ריווח