כיצד להתאים אישית את פיירפוקס Reader הצג עבור קריאה טובה יותר
Reader View הוא תכונה פופולרית של דפדפן פיירפוקס, כי משנה את המראה של דף אינטרנט, ו עושה את זה יותר קריא על ידי הסרת העומס החזותי כגון תמונות, מודעות, כותרות וסרגלי צד. תצוגת קורא היא, עם זאת לא זמינה, עבור כל דפי הבית.
אם התכונה זמינה עבור דף מסוים, תמצא את הסמל כדי לאפשר את זה בצורה של סמל ספר קטן המוצג מימין לסרגל הכתובות.
ישנן מספר מובנית אפשרויות המאפשרים לקוראים להתאים את המראה של תצוגת קורא. אנחנו נסתכל על האפשרויות האלה לפני שנראה לך מה אתה יכול לעשות כדי להמשיך ולהתאים אישית את המראה של Reader View. למטרות הדגמה, אשתמש במאמר של נשיונל ג'יאוגרפיק.
אפשרויות שנבנו מראש
פיירפוקס Reader View מגיע עם כמה אפשרויות התאמה מראש שנבנו מראש כגון כהה, אור ספיה רקעים, מתכוונן גדלי גופנים, ו serif ו sans-serif גליונות. ניתן להתאים אישית את ערכת הנושא על ידי דוחה את כללי CSS של אופציות קיימות אלה.
אני משתמש עור כהה עם גופני serif, וזה אומר שאני צריך לעקוף את השייכות CSS CSS, במקרה שלי .אפל
ו .סריף
.
אם אתה רוצה להתאים אישית עוד גרסה אחרת (עור + גופן), תצטרך השתמש בבוררי CSS המתאימים. אתה יכול לבדוק את אלה בעזרת כלי הפיתוח של Firefox על ידי להכות F12.
יצירת קובץ CSS מותאם אישית
עליך ליצור קובץ שנקרא userContent.css
בתוך ה כרום
תיקיית תיקיית הפרופיל שלך ב- Firefox עבור ההתראות האישיות של Reader שלך. כדי לאתר את תיקיית הפרופיל של Firefox, הקלד אודות: תמיכה
לשורת הכתובת ולחץ על Enter.
תמצא את עצמך בדף המכיל את נתונים טכניים הקשורים להתקין את Firefox. לחץ על הלחצן הצג תיקייה, והיא תפתח את תיקיית הפרופיל שלך.
צור תיקייה בשם כרום
בתוך תיקיית הפרופיל שלך (אם עדיין אין ברשותך) וקובץ בשם userContent.css
בתוך ה כרום
תיקייה. נתיב הקובץ נראה כך:
... \ פרופילים \\ chrome \ userContent.css
הוסף את כללי CSS המותאמים אישית
לאחר שיצרת ופתח userContent.css
בעורך קוד, הגיע הזמן להוסיף את כללי CSS שלך. כדי להתאים אישית את העיצוב של קורא תצוגה, אתה צריך לכו עם הבורר המתאים.
ניתן להשתמש בבוררים הבאים עבור אפשרויות ברירת המחדל השונות:
/ * כאשר הרקע הכהה נבחר \ /: root [hasbrowserhandlers = "true"] body.dark / * כאשר הרקע הבהיר נבחר / /: root [hasbrowserhandlers = "true"] body.light / * כאשר sepia הרקע נבחר \ /: root [hasbrowserhandlers = "true"] body.sepia / * כאשר גופן serif נבחר * /: root [hasbrowserhandlers = "true"] body.serif / * כאשר sans-serif font נבחר * /: root [hasbrowserhandlers = "true"] body.sans-serif
ניתן גם לשלב את השיעורים, למקד לשילוב מסוים של הגדרות.
/ * כאשר רקע כהה וגופן serif נבחרים * /: שורש [hasbrowserhandlers = "true"] body.dark.serif / * כאשר רקע גופן ו sans-serif גופן נבחרים * /: root [hasbrowserhandlers = "true" ] body.sans-serif.sepia
אל תשתמש בורר משותף : root [hasbrowserhandlers = "true"] הגוף
כדי לכוון את כל ההגדרות בבת אחת. זה יעבוד, אבל זה יהיה משפיעים גם על דפי דפדפן אחרים, כמו אודות: newtab
, כמו אלמנטים שורש שלהם גם לשאת יש
(המשמשת לסימון מטפלי האירועים של דפים פנימיים ב- Firefox, כגון על אודות:
עמודים).
הנה הקוד שהוספתי ל- My userContent.css
. שיניתי את משפחת הגופנים, סגנון הגופן, הצבעים והרחיב את מיכל הטקסט. ניתן להשתמש בכל כללי סגנון אחרים בהתאם לטעם שלך.
/ ** userContent.css *************************** /: root [hasbrowserhandlers = "true"] body.dark.serif,: root [hasbrowserhandlers = "true"] body.dark.serif # reader-domain font-family: "שליח חדש"! חשוב; : root [hasbrowserhandlers = "true"] body.dark.serif background-color: # 13131F! חשוב; צבע: # BAE3DB! חשוב; : root [hasbrowserhandlers = "true"] body.dark.serif # reader-domain font-style: italic! חשוב; : root [hasbrowserhandlers = "true"] body.dark.serif h1,: root [hasbrowserhandlers = "true"] body.dark.serif h2,: root [hasbrowserhandlers = "true"] body.dark.serif h3,: שורש [hasbrowserhandlers = "true"] body.dark.serif h4,: root [hasbrowserhandlers = "true"] body.dark.serif h5 color: # 06FEB0! חשוב; : root [hasbrowserhandlers = "true"] body.dark.serif a: link color: # 83E7FF! important; : root [hasbrowserhandlers = "true"] body.dark.serif #container max-width: 50em! חשוב;
שים לב כי יש צורך להשתמש !חשוב
מילת מפתח ב- userContent.css
עבור כל כללי CSS. הדפדפן מוסיף ערכי מאפיינים של המשתמש לפני הערכים שצוין על ידי המחבר (היזם של דף האינטרנט הנתון, כאן Reader View). לפיכך, כל ערך נכס שצוין על ידי המשתמש ללא !חשוב
מילת מפתח לא תפעל אם גיליון סגנונות שהוגדר על ידי המחבר גם ממקד לאותו נכס, כיוון שהוא יידרוס.
תוצאה סופית
תוכל לראות את השינויים של ערכת הנושא של Reader Reader שלי. השתמש בכללי CSS שלך כדי להתאים אישית את העיצוב של תצוגת ה- Firefox המותאמת אישית שלך.
לפני
לאחר
אם אתה רוצה לצלול עמוק יותר את הנושא התאמה אישית של כלי פיירפוקס, לבדוק את המדריך הקודם שלי על התאמה אישית של ערכת נושא של פיירפוקס כלים.