Nov 1, 2023 · 4 min read · 우리가 좋아하는 CSS 전처리기 기능 중 하나인 CSS Nesting이 이제 CSS 자체에 내장되었다. 2023년 구글 크롬 브라우저를 선두로 하여 다른 브라우저들도 하나 둘 씩 지원하기 시작했다. 더 이상의 선택자 노가다는 그만! CSS Nesting이란? Nesting은 중첩이라는 의미로, 말 그대로 CSS 선택자들을 중첩구조로 작성할 수 있는 기능을 의미한다. 기존 선택자 방식은 아래 자식 선택자를 선택하기 위해 단순 나열하는 구조...
Join discussion
Sep 25, 2023 · 1 min read · ⚠️ 本篇文章已搬遷至 css.im1010ioio.dev，請至新站閱讀完整版。 以往 CSS 要使用巢狀管理要透過 Sass (SCSS) 或 Less 等預處理器才能實現，現在原生的 CSS 巢狀也可以使用了。前陣子在 Firefox 117 終於支援後，全部最新的瀏覽器都已支援了，可以逐漸開始使用它囉！不過如果 TA 有使用較舊的瀏覽器的話，要斟酌使用。 ↓ 今日學習重點 ↓ 了解如何使用原生 CSS 巢狀 (CSS Nesting) 了解原生 CSS 巢狀的限制 (與 SCS...
Join discussion
Aug 12, 2023 · 4 min read · CSS Nesting used to only be possible in CSS preprocessors like Sass and Less. But guess what, it's now built-in native CSS and all modern browsers will support it after August 29th. Let's see what's CSS Nesting and how we can use it. What is CSS Nest...
Join discussion
Feb 3, 2023 · 2 min read · CSS nesting will be available in Chrome behind a developer flag starting from v109. CSS nesting allows you to nest one style inside another. You can nest hover selectors, media queries etc which can be dependent on the parent element or be the parent...
Join discussion
Jan 15, 2023 · 4 min read · Browsing caniuse.com the other day, I found a pleasant surprise: a little green flag in a red box for a feature I'd been waiting for a long time. CSS nesting will soon be supported on Chrome: Yes, it's behind a flag and only in future versions, but ...
SBAMSeokaos and 2 more commented