ההבדל בין "תצוגה: אף אחד" לבין "נראות: מוסתר" ב- CSS

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

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

רְאוּת

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

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

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

לְהַצִיג

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

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

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

מאמר מקורי מאת ג'ניפר קרינין. בעריכת ג'רמי ג'ירארד ב -3 / 3/17