PLINKFEED
검색구독
ALLAI-MLBACKENDFRONTENDDEVOPSSECURITYMOBILEDATABASECLOUDOTHER

© 2026 PLINKFEED — AI가 선별한 IT 기술 뉴스

구독소개개인정보처리방침이용약관

CSS-Tricks

AI가 선별한 아티클

5·frontend·분석·CSS-Tricks·2026. 05. 25.

Cross-Document View Transitions: Scaling Across Hundreds of Elements

CSS에서 뷰 전환 관리의 어려움을 다루는 글입니다.

The article addresses the challenges of managing view transitions in CSS.

#css#view-transition#pseudo-elements
요약 보기원문 →
5·frontend·기타·CSS-Tricks·2026. 05. 22.

The State of CSS Centering in 2026

2026년 CSS 요소 중앙 정렬 상태에 대한 탐구.

Exploring the state of CSS centering options in 2026.

#css#flexbox#grid#html#responsive
요약 보기원문 →
5·other·기타·CSS-Tricks·2026. 05. 20.

Stack Overflow: When We Stop Asking

Stack Overflow 질문의 급감은 IT 학습 방식에 대한 경고를 의미한다.

The decline in Stack Overflow questions signals a warning about learning in our industry.

요약 보기원문 →
5·frontend·기타·CSS-Tricks·2026. 05. 18.

Cross-Document View Transitions: The Gotchas Nobody Mentions

크로스 문서 뷰 전환에 대한 주의점과 정보 공유.

Insights on cross-document view transitions and their challenges.

#css#view transitions#web development
요약 보기원문 →
5·frontend·기타·CSS-Tricks·2026. 05. 15.

What’s !important #11: 3D Voxel Scenes, Flying Focus, CSS Syntaxes, and More

3D 복셀 장면 및 새로운 CSS 문법에 관한 뉴스레터입니다.

Newsletter covering 3D voxel scenes and new CSS syntaxes.

#css#3d#voxel#animations#focus
요약 보기원문 →
5·frontend·튜토리얼·CSS-Tricks·2026. 05. 14.

Computing and Displaying Discounted Prices in CSS

CSS를 이용해 할인된 가격을 계산하고 표시하는 방법을 설명합니다.

This article explains how to calculate and display discounted prices using CSS.

#css#attr#mod#round
요약 보기원문 →
5·frontend·기타·CSS-Tricks·2026. 05. 13.

rotateX()

rotateX() 함수는 3D 공간에서 요소를 x축을 중심으로 회전시킵니다.

The rotateX() function rotates an element around the x-axis in 3D space.

#css#rotatex
요약 보기원문 →
5·frontend·기타·CSS-Tricks·2026. 05. 13.

rotateY()

rotateY() 함수는 요소를 수직 y축을 기준으로 회전시킨다.

The rotateY() function rotates an element around its vertical y-axis.

#css#rotatey
요약 보기원문 →
5·frontend·기타·CSS-Tricks·2026. 05. 13.

rotateZ()

rotateZ() 함수는 요소를 z축을 중심으로 회전시킵니다.

The rotateZ() function rotates an element around its z-axis.

#css#transform
요약 보기원문 →
5·frontend·기타·CSS-Tricks·2026. 05. 13.

rotate()

rotate() 함수는 2D 평면에서 요소를 회전시킵니다.

The rotate() function spins an element in a 2D plane.

#css#rotate
요약 보기원문 →
7·frontend·기타·CSS-Tricks·2026. 05. 12.

Soon We Can Finally Banish JavaScript to the ShadowRealm

ShadowRealm API는 JavaScript를 격리할 수 있는 새로운 영역을 제안합니다.

The ShadowRealm API proposes a new realm for isolating JavaScript.

#javascript#shadowrealm
요약 보기원문 →
6·frontend·CSS-Tricks·2026. 05. 11.

Why Keyboard Users Can’t Scroll Your Overflow Containers

키보드 사용자가 오버플로우 컨테이너에서 스크롤할 수 없는 이유를 설명합니다.

Explains why keyboard users cannot scroll in overflow containers.

요약 보기원문 →
5·frontend·기타·CSS-Tricks·2026. 05. 08.

Using CSS corner-shape For Folded Corners

CSS에서 모서리 모양을 사용한 접힌 모서리 기법 소개

Introduction to folded corners technique using CSS corner-shape.

#css#corner-shape
요약 보기원문 →
5·frontend·기타·CSS-Tricks·2026. 05. 07.

A Scrollytelling Gift for Mum on Mother’s Day 2026

2026년 어머니의 날에 대한 스크롤링 이야기 실험에 대한 설명.

Explaining a scrollytelling experiment for Mother's Day 2026 inspired by my mum.

#scrollytelling#css#web#development
요약 보기원문 →
7·other·기타·CSS-Tricks·2026. 05. 06.

Google’s Prompt API

구글이 Chrome 사용자에게 Gemini Nano를 무단으로 배포했습니다.

Google has silently distributed Gemini Nano, a 4GB AI model, to Chrome users without permission.

#chrome#gemini nano#ai#web standards
요약 보기원문 →
5·frontend·튜토리얼·CSS-Tricks·2026. 05. 06.

Making Zigzag CSS Layouts With a Grid + Transform Trick

CSS Grid로 지그재그 레이아웃 만드는 방법 소개.

Introduction to creating zigzag layouts using CSS Grid.

#css#grid#layout#web design#transform
요약 보기원문 →
5·frontend·분석·CSS-Tricks·2026. 05. 04.

Fixed-Height Cards: More Fragile Than They Look

고정 높이 카드의 정렬 문제와 그로 인한 어려움을 다룬 기사입니다.

An article discussing the challenges of aligning fixed-height cards in a multi-column layout.

#css#flexbox#grid#responsive design#web layout
요약 보기원문 →
5·frontend·기타·CSS-Tricks·2026. 05. 01.

What’s !important #10: HTML-in-Canvas, Hex Maps, E-ink Optimization, and More

HTML-in-Canvas, 육각형 맵, 전자 잉크 최적화 등 다양한 개발 실험이 소개된다.

Developers explore HTML-in-Canvas, hex maps, e-ink optimization, and more.

#html#canvas#e-ink#hexagonal map#web
요약 보기원문 →
5·frontend·CSS-Tricks·2026. 04. 30.

The Importance of Native Randomness in CSS

CSS에서 랜덤 숫자를 생성하는 새로운 기능이 추가됩니다.

New functions for generating random numbers in CSS are coming!

요약 보기원문 →
4·frontend·CSS-Tricks·2026. 04. 29.

contrast()

contrast() 필터 함수는 요소의 대비를 조절합니다.

The contrast() filter function adjusts an element's contrast.

요약 보기원문 →
5·frontend·CSS-Tricks·2026. 04. 29.

contrast-color()

contrast-color() 함수는 색상에 따라 대비되는 흑백을 반환합니다.

The contrast-color() function returns either black or white based on the given color for better contrast.

요약 보기원문 →
5·frontend·CSS-Tricks·2026. 04. 27.

Let’s Use the Nonexistent ::nth-letter Selector Now

저자는 존재하지 않는 ::nth-letter 선택자를 사용하자는 제안을 한다.

The author advocates using the nonexistent ::nth-letter selector.

요약 보기원문 →
5·frontend·CSS-Tricks·2026. 04. 23.

Recreating Apple’s Vision Pro Animation in CSS

Apple Vision Pro 헤드셋의 애니메이션을 CSS로 재현하는 방법을 다룹니다.

The article discusses recreating the animation of Apple Vision Pro headset using CSS.

요약 보기원문 →
5·frontend·튜토리얼·CSS-Tricks·2026. 04. 22.

Enhancing Astro With a Markdown Component

Markdown 컴포넌트를 활용해 Astro를 개선하는 방법에 대해 설명합니다.

Explains how to enhance Astro using a Markdown component.

#astro#markdown
요약 보기원문 →
5·frontend·CSS-Tricks·2026. 04. 20.

Markdown + Astro = ❤️

Astro의 Markdown 지원을 MDX로 향상시킬 수 있다는 내용입니다.

Astro's Markdown support can be enhanced with MDX.

요약 보기원문 →
5·frontend·기타·CSS-Tricks·2026. 04. 17.

What’s !important #9: clip-path Jigsaws, View Transitions Toolkit, Name-only Containers, and More

클립 경로 퍼즐과 뷰 전환 툴킷을 다룬 최신 웹 플랫폼 기능을 소개합니다.

Introducing new web platform features like clip-path jigsaws and a view transitions toolkit.

#clip-path#view transitions#containers#css#web
요약 보기원문 →
6·frontend·기타·CSS-Tricks·2026. 04. 16.

A Well-Designed JavaScript Module System is Your First Architecture Decision

잘 설계된 JavaScript 모듈 시스템은 중요한 아키텍처 결정이다.

A well-designed JavaScript module system is a crucial architecture decision.

#javascript#modules
요약 보기원문 →
모든 아티클을 불러왔습니다.