שינוי תכונות גופנים

למד כיצד להשתמש ב- CSS כדי לשנות תכונות גופן

גופנים ו CSS

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

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

• צֶבַע
• משפחת גופן
• גודל גופן

ישנם שלושה חלקים לגופן:

• צֶבַע
  • זהו הצבע שהגופן יציג כמו על המסך.
• גודל
  • זה איך גדול או קטן את הגופן יעבד על המסך.
• פָּנִים
  • זוהי משפחת הגופנים, מה שמכונה לעתים קרובות את הגופן בפועל.

צבעי גופן

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

נסה את הסגנונות הבאים בדפי האינטרנט שלך:

גופן זה צבע אדום
גופן זה בצבע כחול

גודל גופן

כאשר אתה מגדיר את גודל הגופן באינטרנט אתה יכול להגדיר אותו בגדלים יחסית או להיות ספציפי מאוד באמצעות פיקסלים, סנטימטרים או אינץ '. עם זאת, גודלי הגופן המדויקים יותר אמורים לשמש להדפסה ולא עבור דפי אינטרנט, שבהם לכל מי שמציג את האתר שלך יש רזולוציה אחרת, גודל צג או הגדרת גופן ברירת מחדל. לכן, אם אתה בוחר 15px כגודל סטנדרטי שלך, אתה יכול להיות מופתע unpleasantly לראות איך גדול או קטן הגופן שלך renders ללקוחות שלך.

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

גופן זה 1em
גופן זה .75em
גופן זה 1.25em

גופן פנים

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

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

אחת ערימות הגופן האהובים עלי היא קבוצה זו היא אוסף גופן sans-serif ו בעוד geneva ו arial לא נראה נורא דומה, הם שניהם סטנדרטיים למדי על מקינטוש ו- Windows המחשבים. אני כולל helvetica ו helv עבור לקוחות על מערכות הפעלה אחרות כגון יוניקס או לינוקס כי אולי אין ספריית גופן חזקים.

גופן זה sans-serif
גופן זה serif