# CSS에 if() 인라인 조건문 추가 예정

> Clean Markdown view of GeekNews topic #15442. Use the original source for factual precision when an external source URL is present.

## Metadata

- GeekNews HTML: [https://news.hada.io/topic?id=15442](https://news.hada.io/topic?id=15442)
- GeekNews Markdown: [https://news.hada.io/topic/15442.md](https://news.hada.io/topic/15442.md)
- Type: news
- Author: [xguru](https://news.hada.io/@xguru)
- Published: 2024-06-21T09:33:02+09:00
- Updated: 2024-06-21T09:33:02+09:00
- Original source: [lea.verou.me](https://lea.verou.me/blog/2024/css-conditionals/)
- Points: 20
- Comments: 7

## Summary

과연 CSS는 어디까지 발전하게 되는 걸까요? 글 마지막에도 있지만, "CSS는 다른 프로그래밍 언어보다 마스터하기 어렵다" 라는 말에 더욱 더 공감합니다만, CSS에 대한 전문성은 인정받기가 참 어려운 것 같아요.

## Topic Body

- 지난 주, CSS WG는 인라인 `if()`를 CSS에 추가하기로 결정했음  
- 과거 여러 번 거절된 제안이지만, 이번에는 스타일 쿼리와 `media()` 및 `supports()` 문법을 참조하여 수용됨  
- 개발자들의 반응이 매우 긍정적이었음. 브라우저가 이 기능을 우선순위로 두고 로드맵에 추가하기를 희망  
  
##### `if()`의 용도는? 스타일 쿼리를 대체하는가?  
- 스타일 쿼리를 보완하는 역할을 함. 스타일 쿼리가 가능한 경우 스타일 쿼리를 사용하는 것이 더 좋음  
- 하지만 스타일 쿼리로 할 수 없는 것들이 있음. 예를 들어 `--variant` 커스텀 프로퍼티를 사용하여 배경색, 테두리 색, 텍스트 색, 아이콘 등을 설정하는 경우  
- 스타일 쿼리는 하위 요소에만 적용되므로, 요소 자체에 선언을 설정할 수 없음.  
- 프레젠테이션 속성은 유연성, 간결성, 일관성 등의 문제가 있음.  
- `if()`를 사용하면 요소 자체에 선언을 설정할 수 있음.  
- 미디어 쿼리와 지원 조건도 `if()`의 조건 구문에 포함시킬 수 있음.  
  
##### 현재 브라우저에 적용되어 있는가?  
- 아직 브라우저에 적용되지 않았음  
- 낙관적으로 봐도 구현까지는 최소 2년 정도 걸릴 것으로 예상됨  
- 현재는 기능에 대한 합의가 이루어졌을 뿐, 구현 단계는 아님  
  
##### CSS에서 조건부 문법이 처음인가?  
- CSS에는 처음부터 조건부 문법이 있었음. 모든 선택자가 조건부 문법의 일종임  
- `@media`, `@supports` 규칙도 조건부 문법임.  
  
##### 이것이 CSS를 명령형 언어로 만드는가?  
- 명령형과 선언형의 차이는 논리가 아닌 추상화 수준에 있음  
- 조건부 논리가 추가되더라도 CSS는 여전히 선언형 언어임  
  
##### 이것이 CSS를 프로그래밍 언어로 만드는가?  
- CSS는 이미 오랜 기간 동안 프로그래밍 언어로 간주될 수 있었음  
- CSS를 프로그래밍 언어로 보는 기준은 중요하지 않음  
- "**중요한 것은 CSS에 대한 전문성을 인정받는 것임**"  
> "여러 유명 프로그래밍 언어와 CSS를 아는 사람이라면 누구나 알 수 있듯이, CSS는 마스터하기가 훨씬 더 어려움"

## Comments



### Comment 26470

- Author: budlebee
- Created: 2024-06-21T22:28:22+09:00
- Points: 1

조만간 css로 둠을..!

### Comment 26468

- Author: [hidden]
- Created: 2024-06-21T19:52:14+09:00
- Points: 1

[숨김 처리된 댓글입니다]

### Comment 26461

- Author: unsure4000
- Created: 2024-06-21T16:34:47+09:00
- Points: 1

이게 뭔 ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ

### Comment 26456

- Author: tsboard
- Created: 2024-06-21T11:31:17+09:00
- Points: 1

CSS가 정말 배워도 배워도 끝이 없는 것 같습니다. 너무 어려워지는 거 아닌가 싶기도 하네요...

### Comment 26451

- Author: savvykang
- Created: 2024-06-21T10:47:48+09:00
- Points: 1

HTML로 UI를 만들기로 결정한 업보의 스노우볼이 또 한번 커지는 순간이네요

### Comment 26449

- Author: princox
- Created: 2024-06-21T10:19:11+09:00
- Points: 3

이게 CSS인가... Javascript인가.... CSSScript인가...

### Comment 26439

- Author: nemorize
- Created: 2024-06-21T09:52:33+09:00
- Points: 3

개인적으론 투 머치가 아닌가 싶습니다...