יצירה והחלה של סגנון

חשוב: מאמר זה תורגם בתרגום מכונה, ראה כתב ויתור. תוכל למצוא את הגרסה באנגלית של המאמר כאן לעיונך.

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

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

בנושא זה

סוגים של סגנונות

יצירת סגנון

החלת סגנון

סוגים של סגנונות

סגנון שנמצא ב- CSS חיצוני או פנימי יכול להיות מבוססי-כיתה, המבוססים על רכיבים או המבוססים על מזהים. סגנון מוגדר על-ידי הגדרת כלל שלו, המורכב בורר, ואחריו קטע הצהרות המאפיין המופיעים בין סוגריים מסולסלים שמאלי ({}) לבין מסולסל ימני ({). כל סוג של סגנון ייחודי מסוגים אחרים של סגנון על-ידי בורר שלו; הבורר עבור סגנון מבוססי-כיתה; הקודם נקודה (.) סימן סולמית (#) מופיע לפני הבורר לסגנון המבוססים על מזהים; ומורכב הבורר לסגנון המבוססים על רכיבים של רכיב HTML, כגון ברכיב H1 בלבד.

הסגנונות מבוססי-כיתה

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

בדוגמה הבאה, "מבוא" הוא בורר הסגנון, ו- "גודל גופן: קטן" היא הצהרת מאפיין אחד, ואחריו הצהרה המאפיין השניה.

דוגמה של כלל להגדיר עבור סגנון מבוססי-כיתה

.introduction {font-size: small; color: white}

דוגמה של מבוססי-כיתה הוחל סגנון על תג < p >

<p class="introduction">

סגנונות המבוססים על רכיבים

השתמש בסגנונות המבוססים על רכיבים להגדרת ערכה של מאפיינים הרצוי בכל מופע של רכיב HTML מסוים כדי להשתמש בדף אינטרנט. לדוגמה, כדי ליצור שוליים של 25 פיקסלים סביב כל הפיסקאות (תוכן המוקפים תגיות < p >) בדף האינטרנט שלך, יצירת סגנון המבוססים על רכיבים של המשתמש ברכיב p בתור בורר שלו ומכילה הצהרות עבור השוליים מאפיינים, כפי שמוצג בקוד הבא.

דוגמה של ערכת עבור סגנון המבוססים על רכיבים של כללים

p { margin-left: 25px; margin-right: 25px }

סגנונות המבוססים על מזהים

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

דוגמה של ערכת עבור סגנון המבוססים על מזהים של כללים

#footer {background-color: #CCCCCC; margin: 15px}

דוגמה של סגנון המבוססים על מזהים מוחל על תגית < p >

<p id="footer">

סגנונות מוטבעים

השתמש סגנון מוטבע כאשר אתה מעוניין מגדירים ערכה חדשה של מאפיינים עבור פריט יחיד או בלוק של פריטים בדף אינטרנט ואינך מעוניין לעשות שימוש חוזר סגנון זה. שלא כמו סגנונות המבוססים על מזהים, המבוססים על רכיבים ולאחר מבוססי-כיתה, שאת המאפיינים מוגדרים באזור אחד הכותרת של דף אינטרנט (פנימי CSS) או בקובץ CSS חיצוני, המאפיינים של תמונה מוטבעת סגנונות (או מוטבעת CSS) מוגדרים ישירות ברכיב ה-HTML שבו ברצונך להשתמש בסגנון.

דוגמה של כלל להגדיר עבור סגנון מוטבע

<p style="font-weight: bold; font-style: italic; color: #FF0000">

לראש הדף

יצירת סגנון

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

יצירת סגנון באמצעות תיבת הדו-שיח ' סגנון חדש

  1. בצע אחת מהפעולות הבאות:

    • כדי להוסיף סגנון CSS חיצוני, פתח את הקובץ. css.

    • כדי להוסיף סגנון ל- CSS פנימי, פתח את דף האינטרנט.

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

  2. בצע אחת מהפעולות הבאות:

    • כדי ליצור סגנון חדש    לחץ על סגנון חדש באחד מהמיקומים הבאים: חלונית המשימות החלת סגנונות או חלונית המשימות ' נהל סגנונות, סרגל הכלים סגנון או תפריט עיצוב.

    • כדי להעתיק סגנון קיים    בצע אחת מהפעולות הבאות:

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

      • חלונית המשימות ' נהל סגנונות או חלונית המשימות ' מאפייני CSS, באמצעות לחצן העכבר הימני על הסגנון שברצונך להעתיק ולאחר מכן בחר העתק סגנון חדש.

  3. בתיבת הדו-שיח סגנון חדש, בצע את הפעולות הבאות:

השתמש באפשרות זו

לשם ביצוע פעולה זו

בורר

  • כדי להשתמש בורר מחלקה, הקלד נקודה (.) ואחריו שם ייחודי.

  • כדי להשתמש בורר זיהוי, הקלד סימן סולמית (#) ואחריו שם ייחודי.

    הערה: שמות בורר מחלקה ומזהה אינם יכולים להכיל רווחים, אלא אם אתה יוצר בורר מורכבים.

  • כדי להשתמש בורר רכיב, או הקלד את השם של רכיב HTML או לחץ על התיבה הנפתחת בורר ובחר שם רכיב.

  • כדי להשתמש בורר בתוך השורה, בחר סגנון מוטבע.

  • כדי ליצור בורר מורכבים, הקלד הבורר.

להגדיר

בחר אחת מהאפשרויות הבאות:

  • העמוד הנוכחי מוסיפה את הסגנון החדש ה-CSS פנימית בדף האינטרנט הנוכחי.

  • גליון סגנונות חדשים מוסיפה את הסגנון החדש CSS חיצוניים ריק חדש.

  • גליון סגנונות קיים מוסיפה את הסגנון החדש CSS חיצוני קיים שאתה מציין.

החלת סגנון חדש על בחירת מסמך

החלת הסגנון על הקטע הנבחר הנוכחי בדף האינטרנט הנוכחי.

כתובת URL

אם בחרת גליון סגנונות קייםבהגדר ב, הזן הקובץ. css כתובת ה-URL.

קטגוריה

בחר באחת האפשרויות הבאות ולאחר מכן הגדר את המאפיינים המופיעים ימינה בתיבת הדו-שיח:

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

  • מאפייני הגופן, כולל גודל, משקל, קישוטים וצבע ערכות גופנים.

  • בלוק הגדרת גובה שורה, יישור טקסט, טקסט כניסה ומרווח בין טקסט.

  • רקע מגדירה רקע צבע ורקע מאפייני תמונה.

  • גבול קובע גבול ואת המאפיינים שלו.

  • תיבת מגדיר מאפייני שוליים ומרווח של תיבת ורכיבי ברמת בלוק.

  • מיקום מגדיר את המידות ואת המיקום של תיבת ורכיבי ברמת בלוק.

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

  • רשימת קובעת את המאפיינים של פריטי רשימה, כולל סוג, מיקום תמונה.

  • טבלה קובעת את המאפיינים של רכיבי הקשורה לטבלת, כולל מרווח, פריסה, מאפייני גבול.

הערה: באפשרותך גם להעתיק סגנון מתוך CSS אחד לשני. בחלונית המשימות ' נהל סגנונות ', גרור את הסגנון מתוך ה-CSS המכיל אותו סגנון על שם של ה-CSS שברצונך להעתיק אותה, או נקודה מסוימת מתוך הרשימה של סגנונות המהווה יעד CSS.

יצירת סגנון מוטבע באמצעות חלונית המשימות ' מאפייני CSS

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

  2. בחלונית המשימות מאפייני CSS, תחת כללי שהוחלו, או באמצעות לחצן העכבר הימני על בורר שברצונך להחיל את סגנון מוטבע כדי, או, אם "(לא הוחלו כללים) " מופיעה, באמצעות לחצן העכבר הימני במקום כלשהו תחת להחיל כללי ולאחר מכן לחץ על סגנון מוטבע חדש בתפריט הקיצור.

  3. תחת מאפייני CSS, הגדר את המאפיינים שהרצויים.

יצירה והחלה של סגנון חדש לא מוגדר

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

  1. בתצוגת עיצוב או תצוגת קוד, בדף האינטרנט שלך, בחר את הפריט שברצונך להחיל סגנון.

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

לראש הדף

החלת סגנון

באפשרותך להשתמש בחלונית המשימות החלת סגנונות, חלונית המשימות ' נהל סגנונות או סרגל הכלים סגנון כדי להחיל סגנונות מבוססי-כיתה או המבוססים על מזהים מהמיקום שלך פנימיים וחיצוניים גליונות סגנונות מדורגים (CSS). חלונית המשימות החלת סגנונות מאפשר לך להחיל סגנונות מרובים לבחירה, בעוד חלונית המשימות ' נהל סגנונות ואת סרגל הכלים סגנון מוגבלות להחלת סגנון אחד. סרגל הכלים סגנון מאפשרת לך שם ולהחיל סגנונות שלא הוגדר חדשים בדף שלך במהירות.

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

  1. בתצוגת עיצוב או תצוגת קוד, בדף האינטרנט שלך, בחר את הפריט שברצונך להחיל סגנון.

  2. בצע אחת מהפעולות הבאות:

    • כדי להחיל סגנונות קיימים מרובים    בחלונית המשימות החלת סגנונות, הקש CTRL תוך לחיצה על כל הסגנון הרצוי.

    • כדי להחיל סגנון קיים יחיד    בצע אחת מהפעולות הבאות:

      • בחלונית המשימות החלת סגנונות, לחץ על סגנון מחלקה או מזהה שהרצוי.

      • בסרגל הכלים של סגנון, מחלקה או תיבה נפתחת מזהה, לחץ על הסגנון שהרצוי.

      • בחלונית המשימות ' נהל סגנונות ', באמצעות לחצן העכבר הימני על סגנון מחלקה או מזהה שאתה מעוניין ולאחר מכן לחץ על החל סגנון בתפריט הקיצור.

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

לראש הדף

הערה: כתב ויתור בנוגע לתרגום מכונה: מאמר זה תורגם על-ידי מערכת מחשב, ללא התערבות אדם. Microsoft מציעה את תרגומי המכונה כדי לסייע למשתמשים שאינם דוברי אנגלית ליהנות מתוכן בנושא מוצרים, שירותים וטכנולוגיות של Microsoft. מכיוון שהמאמר תורגם על-ידי מכונה, הוא עלול להכיל שגיאות באוצר המילים, בתחביר או בדקדוק.

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

האם מידע זה היה שימושי?

תודה על המשוב!

תודה על המשוב! נראה שכדאי לקשר אותך לאחד מנציגי התמיכה של Office.

×