Tính năng lồng ghép trước tiên đã được bật trong Chrome 120.
Đầu năm nay, Chrome đã phát hành tính năng lồng ghép CSS trong phiên bản 112 và giờ đây, Chrome đã có trong mọi trình duyệt chính.
Tuy nhiên, có một yêu cầu nghiêm ngặt và có thể không mong muốn đối với cú pháp, được liệt kê trong bài viết đầu tiên về ví dụ về cách lồng ghép không hợp lệ. Bài viết tiếp theo này sẽ trình bày những thay đổi trong quy cách và từ Chrome 120.
Tên thẻ của phần tử lồng
Một trong những hạn chế đáng ngạc nhiên nhất trong bản phát hành đầu tiên của cú pháp lồng nhau CSS là không thể lồng các tên thẻ của phần tử đơn thuần. Sự bất khả năng này đã bị loại bỏ, giúp các lồng ghép CSS sau đây trở nên hợp lệ:
.card {
h1 {
/* this is now valid! */
}
}
/* the same as */
.card {
& h1 {
/* this is now valid! */
}
}
Điều này trở nên thực sự hấp dẫn khi lồng ghép danh sách theo thứ tự, không theo thứ tự hoặc định nghĩa:
dl {
dt {
/* dl dt styles */
}
dd {
/* dl dd styles */
}
}
Điều gì đã thay đổi để cho phép lồng nhau này?
Phần lớn có được là nhờ một số kỹ sư của Chrome tìm hiểu và tạo nguyên mẫu, kết hợp với mong muốn của cộng đồng và Nhóm công tác CSS.
Khá nghi ngờ về việc trình phân tích cú pháp CSS có thể được dạy để phân biệt giữa tên thẻ (div) và tên thuộc tính (visibility) vì trình phân tích cú pháp hiện không có khái niệm về việc xem trước. Để hiểu rằng mã thông báo là một thuộc tính, trình duyệt cần xem xét trước và kiểm tra xem : có tuân theo mã thông báo không xác định hay không. Do đó, trong thông số kỹ thuật ban đầu, ký hiệu & được dùng để cho trình duyệt biết rằng nội dung tiếp theo đã được lồng vào nhau, chứ không phải là giá trị và thuộc tính CSS thông thường.
May mắn là một kỹ sư phát hiện ra rằng khi trình phân tích cú pháp không thể phân tích cú pháp bộ chọn lồng dưới dạng thuộc tính theo lượt tiêu thụ thông thường, bộ chọn đó có thể được bắt đầu lại ở chế độ giả định bộ chọn thay vì thuộc tính. Quá trình phân tích cú pháp sẽ tiếp tục, xác nhận việc lồng nhau dưới dạng lồng ghép của bộ chọn. Trình phân tích cú pháp đủ nhanh và đáng tin cậy để được xác định đủ để phát hành cú pháp.