טבת

30 סלקטורים של CSS שיש לשנן

המאמר הזה ב-net.tutsplus נותן רשימה של 30 סלקטורי CSS שכדאי לשנן. הוא מתחיל בפשוטים (*, . ,#), ועובר למורכבים יותר:

x~y, X[href*=”nettuts”], X[data-*=”foo”]

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

תוך כדי מניית הסלקטורים, מפוזרים שם טיפים. מה שהכי דיבר אלי היה הטיפ הזה:

אם אתם כותבים את הסלקטורים שלכם כך: Y Z A B.error , אתם שוגים. תמיד שאלו את עצמכם אם זה ממש הכרחי להטיל את כל המשקל הזה

ולפעמים זה לא הסלקטורים שמעניינים אותנו, אלא איזה דפדפן תומך באילו אטריביוטים (attribute). בעיקר ב-CSS3. לפני כמה ימים מצא יניב מהצוות שלנו את האתר http://caniuse.com. שם אפשר לחפש כל אטריביוט, ומקבלים טבלה של הדפדפנים וגרסאותיהם, כשלפי הצבעים ניתן לדעת מי תומך ומי לא, וגם – הגדילו לעשות – איזו קידומת צריך לכתוב ל-attribute במקרים מסויימים (למשל -webkit- או -moz-).

לגזור ולשמור.

3 תגובות על “30 סלקטורים של CSS שיש לשנן

  1. סוף סוף

    תקראי קטע…

    בהתחלה, לא הבחנתי שאני קורא את הPOST הזה מהבלוג שלך, כיוון שאני קורא אותו בגוגל רידר.ומייד חשבתי לשלוח אותו אליך.

    הקלקתי על הכותרת… ובום! אני בבלוג שלך.

    מה יהיה?

  2. מצאתי שימוש ראשון לעצות…

    בקובץ ה CSS של ערכת standard במערכת מוודל, הוספת חוק CSS חדש לעימוד השדות אשר מתחילים ב HTTP:// לשמאל

    input[value*=”http://”] {

    text-align:left;

    direction:ltr;

    }

כתבו תגובה

כתובת הדוא"ל שלכם לא תוצג.