טיפים לשימוש ב-Inspect Element בדפדפן Google Chrome

בהנחה שאתה רוצה טיפים לשימוש בתכונת Inspect Element בדפדפן Google Chrome: לחץ לחיצה ימנית על האלמנט שברצונך לבדוק ובחר 'בדוק' מהתפריט הנפתח. אתה יכול גם להשתמש במקשי הקיצור Ctrl+Shift+I (Windows) או Cmd+Opt+I (Mac) כדי לפתוח את המפקח. לאחר שהמפקח פתוח, תראה את ה-HTML של הדף בצד שמאל ואת ה-CSS בצד ימין. אתה יכול לבצע שינויים ב-HTML וב-CSS ב-Inspector ולראות את השינויים האלה נכנסים לתוקף בדף באופן מיידי. כדי לצאת מהמפקח, פשוט לחץ על ה-X בפינה השמאלית העליונה.

Google Chrome מיועד לא רק למשתמשי אינטרנט כלליים, אלא גם למפתחי אתרים שלעתים קרובות יוצרים אתרים, יוצרים בלוגים וכו'. בדוק את האלמנט אוֹ לִבדוֹק האפשרות Google Chrome עוזרת למשתמשים למצוא מידע מסוים על אתר אינטרנט מוסתר מהעין. הנה כמה טיפים לשימוש ב-Inspect Element בדפדפן Google Chrome עבור Windows PC.

בדוק את רכיב Google Chrome

1] מצא קבצי JavaScript/מדיה מוסתרים

מה קורה אם אני מפריע לשחזור המערכת של חלונות 10

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

מחולל סיסמאות כרום - -

2] קבל קוד צבע HEX/RGB ב-Chrome

לפעמים אנחנו עשויים לאהוב צבע ורוצים לדעת את קוד הצבע שלו. אתה יכול למצוא בקלות את קוד הצבע HEX או RGB המשמש בדף אינטרנט מסוים באמצעות האפשרות המובנית ב-Google Chrome. לחץ לחיצה ימנית על צבע ובחר לִבדוֹק . ברוב המקרים, תקבל קוד צבע בצד ימין עם CSS שונה. אם אינך רואה אותו, ייתכן שתצטרך להשתמש בתוכנת בורר צבעים חינמית.

עֵצָה : תסתכל על אלה כלים מקוונים לבחירת צבעים אותו.

3] קבל טיפים לשיפור ביצועי דפי אינטרנט

כיצד לאתר כתובת דוא"ל לבעליה

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

4] בדיקת היענות

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

ציר הזמן של היסטוריית חלונות -

5] ערוך אתר חי

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

Inspect Element מ-Google Chrome הוא בן לוויה אמיתי של כל מפתח אינטרנט. בין אם אתם מעצבים אתר אינטרנט בעמוד בודד או אתר דינמי, אתם בהחלט יכולים להפיק תועלת מהטיפים הללו.