עדכון תחביר רגוע לגבי קינון CSS

התכונה 'קינון במבט-על' הופעלה ב-Chrome 120.

Adam Argyle
Adam Argyle

מוקדם יותר השנה Chrome שלח את שירות CSS מסוג מיקום בגרסה 112, בכל דפדפן ראשי.

תמיכה בדפדפן

  • Chrome: 120.
  • קצה: 120.
  • Firefox: 117.
  • Safari: 17.2.

מקור

עם זאת, הייתה דרישה מחמירה אחת שעלולה להיות בלתי צפויה התחביר הזה, שמפורט במאמר הראשון של דוגמאות קינון לא חוקי. מאמר המעקב הזה יעסוק בשינויים במפרט ובשינויים שבוצעו ב-Chrome 120.

שמות תגים של רכיב מקונן

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

.card {
  h1 {
    /* this is now valid! */
  }
}

/* the same as */
.card {
  & h1 {
    /* this is now valid! */
  }
}

זה ממש מפתיע כשמציבים בבסיס רשימות סדורות, לא מסודרות או לפי הגדרות:

dl {
  dt {
    /* dl dt styles */
  }

  dd {
    /* dl dd styles */
  }
}

מה השתנה כדי לאפשר את הסידור הזה?

זה בעיקר הודות לחיפוש ופיתוח של מהנדסי Chrome, בשילוב עם הרצון מהקהילה ומקבוצת העבודה של שירות ה-CSS.

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

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