אמולציה של תכונות מדיה שונות ב-CSS בעזרת אפשרויות האמולציה האלה בכרטיסייה רינדור.
אמולציה של תכונת מדיה של CSS prefers-color-scheme
תכונת המדיה של CSS prefers-color-scheme
מציינת אם המשתמש מעדיף ערכת צבעים בהירה או כהה.
כדי לחקות את התנאי הזה:
- בדף prefers-color-scheme, פותחים את הכרטיסייה רינדור.
בקטע Emulate media media media
prefers-color-scheme
, בוחרים אחת מהאפשרויות הבאות מהרשימה הנפתחת:- ללא אמולציה
prefers-color-scheme:light
prefers-color-scheme:dark
צריך לטעון מחדש את הדף. למשל:
אמולציה של סוג מדיה CSS (הפעלת תצוגה מקדימה של הדפסה)
שאילתת מדיה של הדפסה קובעת איך הדף ייראה כשהוא יודפס.
כדי לאלץ את הדף לעבור למצב תצוגה מקדימה של הדפסה:
פותחים את הכרטיסייה רינדור ובקטע Emulate CSS media type בוחרים באפשרות הדפסה.
מכאן תוכלו להציג ולשנות את שירות ה-CSS, כמו כל דף אינטרנט אחר. למידע נוסף, ראו תחילת העבודה עם הצגה ושינוי של CSS.
אמולציה של תכונת מדיה של CSS forced-colors
תכונת המדיה של CSS forced-colors
מציינת אם סוכן המשתמש הפעיל מצב צבעים מאולצים. דוגמה למצב צבעים מאולצים היא Windows עם ניגודיות גבוהה.
כדי לחקות את התנאי הזה:
- פותחים את הכרטיסייה רינדור.
בקטע Emulate media media media
forced-colors
, בוחרים אחת מהאפשרויות הבאות מהרשימה הנפתחת:- ללא אמולציה
forced-colors:active
forced-colors:none
עם אמולציה של forced-colors:active
:
אמולציה של תכונת מדיה של CSS prefers-contrast
תכונת המדיה של CSS prefers-contrast
מציינת אם המשתמש ביקש שתוכן האינטרנט יוצג עם ערך ניגודיות גבוה, נמוך או ספציפי.
כדי לחקות את התנאי הזה:
- פותחים את הכרטיסייה רינדור.
בקטע Emulate media media media
prefers-contrast
, בוחרים אחת מהאפשרויות הבאות מהרשימה הנפתחת:- ללא אמולציה
prefers-contrast:more
prefers-contrast:less
prefers-contrast:custom
אמולציה של תכונת מדיה של CSS prefers-reduced-motion
תכונת המדיה של CSS prefers-reduced-motion
מציינת אם המשתמש ביקש למזער את כמות התנועה בדף.
כדי לחקות את התנאי הזה:
- פותחים את הכרטיסייה עיבוד בהדגמה הזו ומנסים לגלול כדי לראות אנימציות שונות.
- בקטע Emolate Media feature
prefers-reduced-motion
, בוחרים באפשרותprefers-reduced-motion:reduce
. - צריך לנסות לגלול שוב.
אמולציה של תכונת מדיה של CSS prefers-reduced-transparency
התכונה prefers-reduced-transparency
של מדיה של CSS מציינת אם המשתמש ביקש לצמצם את האפקטים של שכבות שקופות או שקופות למחצה שנעשה בהם שימוש במכשיר.
התכונה prefers-reduced-transparency
זמינה בגרסה 118 של Chrome ומאפשרת לכם להתאים את התוכן מהאינטרנט להעדפות שנבחרו על ידי המשתמשים כדי לצמצם את השקיפות במערכת ההפעלה, כמו ההגדרה הפחתת השקיפות ב-macOS.
כדי לחקות את התנאי הזה:
- פותחים את הכרטיסייה רינדור.
- בקטע Emolate Media feature
prefers-reduced-transparency
, בוחרים באפשרותprefers-reduced-transparency: reduce
. - בודקים אם הדף מוצג כמו שצריך.
אמולציה של תכונת מדיה של CSS color-gamut
תכונת המדיה של CSS color-gamut
מציינת באיזה טווח צבעים סוכן המשתמש ומכשיר הפלט תומכים בו.
כדי לחקות את התנאי הזה:
- פותחים את הכרטיסייה רינדור.
בקטע Emulate media media media
color-gamut
, בוחרים אחת מהאפשרויות הבאות מהרשימה הנפתחת:- ללא אמולציה
color-gamut:srgb
– משטח בערך sRGB או יותרcolor-gamut:p3
–, בקירוב, שצוין במרחב צבע P3 ברשת המדיה או יותרcolor-gamut:rec2020
– בדומה למסגרת שצוינה בהמלצה ל-2020 או יותר