> 웹 프론트엔드 > CSS 튜토리얼 > 2025 년 CSS 위시리스트

2025 년 CSS 위시리스트

尊渡假赌尊渡假赌尊渡假赌
풀어 주다: 2025-03-07 16:44:10
원래의
713명이 탐색했습니다.

A CSS Wishlist for 2025 2024는 CSS의 화려한 해입니다 : 교차 문서보기 변환, 스크롤 구동 애니메이션, 앵커 포지셔닝, 애니메이션 높이 : 자동 및 기타. 조금 벗어난 것처럼 들리지만, 우리는 여전히 CSS의 더 많은 기능을 기대하고 있습니다. 많은 기능!

우리는 몇 가지 아이디어와 몇 가지 아이디어를 브레인 스토밍했습니다.

Geoff 's Wish List 우리는 이미 우수한 CSS 도구가 많이 있다고 생각합니다. 우리는 많은 위대한 것들이 있습니다 - 그리고 새로운! —— 기능, 나는 여전히 많은 것을 배우려고 노력하고 있습니다.

하지만! 더 좋은 물건을위한 공간이 항상 있습니다. 아니면 네 가지 새로운 것들을위한 공간이있을 수도 있습니다. 새로운 CSS 기능을 요청할 수 있다면 이것을 선택할 것입니다.

> 1. 조건부 if () 문 곧 출시 될 예정입니다! 또는 CSSWG (CSSS Working Group)가 IF () 조건을 CSS 값 모듈 레벨 5 사양에 추가하기로 결정한 경우 이미 존재합니다. 공식적으로 정의하고 브라우저로 이동하는 데 1 ~ 2 년 (또는 그 이상)이 걸리더라도 큰 개선입니다. if ()에 대한 나의 이해는 그것이 컨테이너 스타일 쿼리를 구현하는 데 핵심 구성 요소라는 것입니다. 이것이 궁극적으로 원하는 것입니다. 다른 요소의 스타일에 따라 조건부로 스타일을 적용 할 수 있다는 것은 CSS의 성배라고 할 수 있습니다. 우리는 이미 다른 요소의 스타일에 따라 요소를 스타일링 할 수 있습니다.

> 2. css mixin 이것은 "케이크의 착빙"기능과 비슷합니다. 왜냐하면 그것이 CSS 사전 처리기 영역에 전적으로 속한다고 생각하기 때문에 CSS의 작문 또는 믹스 인과 같은 가벼운 추상화를위한 도구를 갖는 것이 좋다고 생각하기 때문입니다. 그러나 누군가가 나에게 혼합을 제안한다면, 나는 확실히 거절하지 않을 것입니다. 이것은 아마도 CSS 사전 처리기를 분쇄하고 순수한 CSS를 100% 쓸 수있는 마지막 빨대 일 것입니다. 이제는 믹스 인이나 기능이 필요할 때 SASS를 사용하는 경향이 있기 때문입니다.

나는 믹스 인 제안과 초안 초안 사양에 대한 많은 메모를 작성 하여이 기능을 원하는 이유를 알려줍니다.

> 3. // 인라인 댓글 예, 제발! 이것은 CSS를 다른 언어로하는 주석 쓰기와 비교할 수있는 소규모 개발자 편의입니다. 나는 CSS에 JavaScript 주석을 작성하는 것이 가장 어리석은 CSS 오류 목록에 있어야한다고 확신합니다 (내가 거기에 넣지 않았더라도). f> 4. 글꼴 크기 : FIT

난 그냥 산술을 싫어해, 알았지? ! 때로는 크기가 컨테이너에 맞는 단어 나 짧은 제목을 원합니다. 우리는 유체 타이포그래피에 clamp ()와 같은 도구를 사용할 수 있지만 이것은 여전히 ​​귀찮게하고 싶지 않은 수학입니다. 글꼴 크기 설정에 컨테이너 쿼리 및 컨테이너 쿼리 장치를 사용하는 것이 솔루션 일 수 있지만 뷰포트 장치보다 낫지 않다고 생각할 수도 있습니다.

라이언의 위시리스트 나는 단순하고 작은 마을 CSS 개발자이며 지난 몇 년 동안 내 브라우저에 등장한 모든 새로운 기능에 매우 만족합니다.

브라우저에서 더 많은 앵커 포지셔닝!

CSS 앵커 포지셔닝에 대한 설득이 더 필요하지 않습니다. 이미 믿고 있습니다! 11 월 대부분의 경우 어떻게 작동하는지 알게 된 후 12 월에 언제라도 사용할 수 없다는 것을 알았습니다.

2024 년 말 크롬 기반 브라우저만이이를 지원하지만 불행히도 폴백 및 진보적 인 향상은 쉽지 않습니다. 그러나 사용 가능한 폴리 필드가 있지만, 이는 앵커 포지셔닝에 의해 해결 된 문제와 대조되는 다른 JavaScript 코드를 추가하는 것을 의미합니다.

그러나 나는 참을성이 있었는데, 나는 오랜 시간을 기다렸다.

> 6. 요소를 #Top-Layer로 올리십시오

팝업이 필요하지 않습니까?

나는 앵커 포지셔닝을 좋아하고, 팝업을 좋아하고, 그들은 아주 잘 어울립니다!

팝업에 대한 영리한 점은 #탑층에 나타나므로 z-index와 관련된 스태킹 문제를 피할 수 있다는 것입니다. 이것은 대부분의 사람들이 필요로 할 수 있지만 요소를 움직일 수있는 다른 방법을 갖는 것은 재미있을 것입니다. 또한 #톱층이 존재한다는 것을 알았으므로 더 많은 일을하기 위해 그것을 사용하고 싶습니다. 나는 거기에 무엇이 있는지 알고 싶습니다. > 정확히 무슨 일이 있었나요? 좋아, 아마 사양부터 시작해야 할 것이다. CSS 위치 레이아웃 모듈 레벨 4 드래프트는 #상단 계층, 그 목적 및 여기에 포함 된 요소의 스타일을 처리하는 방법에 대해 설명합니다. 흥미롭게도 #Top-Layer는 사용자 에이전트에 의해 제어되며 전체 화면 API의 부산물 인 것 같습니다. 대화와 팝업이 현재 가능하지만 낙관적으로 이러한 기능의 존재는 요소가 미래의 다른 방식으로 #최고 층으로 홍보 될 수 있음을 의미 할 수 있습니다. 이것은 코요테/로드 러너 유형 케이스 일 가능성이 높습니다.

> 7.

태그에 레이어 속성을 추가하십시오 개인적으로, 캐스케이드는 내가 CSS를 쓴 방식을 바꿨습니다. 태그에 레이어 속성을 포함시킬 수 있다면 좋을 것이라고 생각합니다. 예를 들어 프로젝트에 CSS 재설정을 포함시킬 수 있다고 상상해보십시오. 또는 방문한 페이지에 따라 CSS 섹션을 동적으로 추가하고 캐스케이드에 통합하십시오. 이 기능은 CSSWG Repo에서 제안되어 있으며, 인생의 대부분의 것들과 마찬가지로

복잡합니다.

브라우저는 특히 인식하지 못하는 속성에 대해 까다 롭고 폴백 처리에 대한 분명한 우려가 있습니다. 이 주제는 토론을 위해 W3C 기술 아키텍처 그룹 (TAG)에 제출되었으므로 여전히 희망이 있습니다!

Juandi 's Wish List 인터넷이 거칠고 사람들이 클릭 카운터를 가졌을 때 내가 거기에 없었다는 것을 인정해야합니다. 사실, 나는 당신의 평균 네트워크 감정가에 비해 내가 꽤 젊다 고 생각합니다. 플로트로 레이아웃을 만드는 방법을 알고 있지만 (내가 선택한 첫 번째 웹 코스는 매우 구식입니다) Flexbox 또는 CSS 그리드를 사용하기 전에 오랫동안 견딜 필요는 없었으며 IE 및 브라우저 지원에 치아를 절대로 깎지 않았습니다.

따라서 네트워크가 과거에 실제로 필요한 기능과 현재의 기능과 비교하여 다음과 같은 소원은 사소한 요청처럼 보일 수 있습니다. 어쨌든, 여기에 2025 년에보고 싶은 세 가지 사소한 요청이 있습니다. > 8. 자식 요소 수와 색인을 정수로 가져옵니다 이것은 CSS에서 이미 가능해야한다고 맹세하는 것 중 하나입니다. 상황은 다음과 같습니다. 나는 형제의 요소의 총 지수 또는 자식 요소의 총 수를 알고 싶어합니다. 때로는 문자열 대신 정수가 필요하기 때문에 카운터 () 함수를 사용할 수 없습니다. 현재 방법은 html에서 인덱스를 하드 코딩하는 것입니다.

우유 계란

치즈

또는 CSS에 각 색인을 작성하십시오

어느 쪽이든, 나는 항상이 숫자를 인용하는 것이 더 쉬워야한다는 느낌을 남기고 있습니다. 인터리브 애니메이션에 대한 코드가 더 아름답고 간결하거나 총 숫자에 따라 스타일을 변경하게합니다.
<code><link href="https://cdn.com/some/reset.css" layer="reset" rel="stylesheet"></code>
로그인 후 복사
운 좋게도, 이미 형제-카운트 () 및 형제-인덱스 () 함수에 대한 작업 초안 제안이 이미 있습니다. 구문이 바뀔 수 있지만 2025 년에 그들에 대해 더 많이 듣고 싶습니다.
  • > 9. Flex-wrap
  • 균형을 잡는 방법 나는 이것을 Adam Argyle에서 훔 쳤지 만 Flex-Wrap 레이아웃의 균형을 맞추는 더 좋은 방법이 있기를 바랍니다. 컨테이너가 줄어들면서 요소가 줄을 하나씩 랩핑하면, 그들은 단독 단독으로 남겨져 있거나 (싫어하지 않습니다) 채우기 위해 자라서 (매우 고통스럽게 느껴집니다) :
  • . 나는 라인 브레이크 요소의 균형을 잡는 더 기본적인 방법이 있었으면 좋겠다 :
  • 이것은 확실히 성가신 일입니다.
  • > 10. 읽기/연구하기 쉬운 CSSWG 토론 메소드 나는 CSSWG와 그 모든 일을 정말로 좋아하기 때문에 초안 작업, Github 질문 또는 회의에 대한 메모를 읽는 데 많은 시간을 보냈습니다. 그러나 나는 Github에서 한 링크에서 다른 링크로 점프하는 것을 좋아하지만 특정 토론과 관련된 모든 질문을 찾기가 어렵습니다.
  • 나는 이것이 특정 주제에 대한 당신의 의견을 표현하는 데 시작하는 것에 대한 기준을 높인다고 생각합니다. 질문에 참여하고 싶다면 모든 토론의 큰 그림을 이해해야합니다 (말한 내용, 어떤 일이 효과가 없는지, 고려해야 할 다른 것들 등)는 일반적으로 여러 질문이나 회의에 흩어져 있습니다. 질문이 길어질 수 있지만 문제가되지는 않지만 (읽는 것을 좋아합니다) 토론의 일부가 어딘가에 존재한다는 것을 알지 못합니다.
그래서 직접 CSS 소원은 아니지만, 참여하기 전에 토론의 전체 이야기를 알 수있는 더 쉬운 방법이 있기를 바랍니다.

위시리스트에 무엇이 있습니까?

<code>
<link href="/styles/main.css" rel="stylesheet">
<link href="/components/card.css" layer="components" rel="stylesheet"></code>
로그인 후 복사
우리는 물었다! 당신은 대답했습니다! 군중들로부터 몇 가지 선택은 다음과 같습니다
    배경 이미지를 직접 회전시킵니다 (예 : 배경-로테이트 : 180deg ). 범위, 확장 및 유형의 매개 변수가있는 css random () CSS 앵커 포인트 포지셔닝 모드는 마우스 커서, 포인터 또는 터치 포인트 위치를 배치 할 수 있습니다. 텍스트 블록에서 특정 단어를 쿼리하고 단어가 나타날 때마다 스타일을 적용하는 데 사용되는 문자열 선택기 기본적으로 숨겨진 클래스.
  • 위치 : a : stuck pseudo class
  • 2025 년에 최선을 다하기를 바랍니다 ... CSS- 트릭의 궤적이 지난 몇 년 동안 항상 매끄럽지는 않았으므로 2025 년의 가장 큰 소원은 웹에 대한 토론을 계속 작성하고 영감을주는 것입니다. 행복한 2025!

위 내용은 2025 년 CSS 위시리스트의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿