יסודות הפריסה

Last updated on 10/29/2024@mrbirddev

מבנה של דף אינטרנט ב-slidde

Slidde.co משתמשת במבנה פשוט של ארבע שכבות:

  • userCompName.Page (סגנונות גלובליים)
  • userCompName.Slide (חלוקת תוכן)
  • userCompName.Container (רוחב רספונסיבי, עמודות מרובות)
  • אלמנטים מוטמעים (תוכן ספציפי)

userCompName.Page

שכבת userCompName.Page נמצאת בראש ומשמשת להגדרת סגנונות גלובליים כמו גופנים, צבעים וסגנונות קישורים, מכיוון שתכונות CSS ניתנות להורשה.

באופן אופציונלי, ניתן להשתמש ב-משתני CSS כדי להפוך את התבנית לידידותית יותר למשתמש.

אם אינך יכול לבחור את אלמנט userCompName.Page ישירות, השתמש באפשרות userCompOption.Select page בסרגל הכלים.

תכונת userCompOption.hashSection יכולה לדמות אתר מרובה עמודים. בדוק את הדמו הזה: Demo Link

userCompName.Slide

userCompName.Slide הוא האלמנט ברמה הראשונה תחת userCompName.Page, ומשמש לחלוקת תוכן.
  • דפים פשוטים, כמו דפי "קישור בביוגרפיה", עשויים לכלול רק Slide אחד.
  • דפי נחיתה מורכבים עשויים לכלול מספר מקטעים כמו #header, #hero, #works, #contact, #footer.
userCompOption.htmlId הוא למעשה מזהה HTML. תן להם שמות על פי התוכן בתוך userCompName.Slide כדי להקל על הניווט באמצעות קישורים כמו “#ID”. [למד עוד על קישורי דילוג](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#skip_links).

כדי להסתיר userCompName.Slide מהאתר הסופי אך לשמור אותם, סמן את התכונה userCompOption.hidden. זה דומה לשקפים מוסתרים ב-PowerPoint וניתן להשתמש בו גם להדרכות.

The userCompOption.sticky תכונה מיועדת לסרגלי ניווט צפים או כל אלמנט אחר. ראו דוגמה כאן: Sticky Demo

userCompName.Container

A userCompName.Container מנהל רוחבים רספונסיביים ותצוגות מרובות עמודות.

  • רוחבי מובייל ודסקטופ בדרך כלל שונים. השתמשו בתכונה userCompOption.width ב-userCompName.Container לרוחבים מותאמים במכשירים שונים.
  • עמודות מגדירות כמה עמודות יש במיכל. ניתן להגדיר רוחבים כמו x/12 (לדוגמה, שתי עמודות של 6/12 לרוחב של 50% כל אחת).

כל עמודה יכולה גם לכלול הגדרות יישור אופקי ואנכי.

אחר

אלמנטים אחרים הם אלמנטים בשורה, שניתן למקם בתוך המיכל.

על ידי מעקב אחר גישה מובנית זו, תוכלו ליצור דפי אינטרנט מרשימים ורספונסיביים בקלות באמצעות Slidde.co.

Loading...