Aug 13, 2025 · 1 min read · ⚠️ 本篇文章已搬遷至 css.im1010ioio.dev，請至新站閱讀完整版。 CSS 的 3D transform 讓我們可以在網頁上建立 3D 立體效果，讓元素看起來像是在一個 3D 空間中移動或旋轉。 要使用 3D transform，除了了解各種 3D 函數，還必須正確設置場景的深度和視角。在本篇文章中，我們將先了解如何建立 3D 場景，再學習常見的 3D transform 函數。 1. 建立 3D 場景的基礎 在開始 3D transform 之前，我們需要設置一個具有深度...
Join discussion
Aug 13, 2025 · 1 min read · ⚠️ 本篇文章已搬遷至 css.im1010ioio.dev，請至新站閱讀完整版。 CSS 的 transform 屬性是一個功能強大的工具，它允許我們以簡單的方式對元素進行平移、縮放、旋轉和傾斜等 2D transform 效果，而不需要使用 JavaScript 或圖片編輯工具。transform 可以讓網站更具動態效果，提升視覺吸引力。 本文將詳細介紹常見的 transform 函數以及其應用方式。 基本語法 selector { transform: 方法(數值); } tr...
Join discussion
May 31, 2025 · 3 min read · ওয়েব ডিজাইনের দুনিয়ায় CSS Transition ও Transform একটি ওয়েবসাইটের UI (User Interface) উন্নত করার গুরুত্বপূর্ণ হাতিয়ার। এগুলোর সাহায্যে ওয়েবপেজে বিভিন্ন অ্যানিমেশন ও গতিশীলতা যোগ করা যায় যা ইউজারদের জন্য দৃষ্টিনন্দন অভিজ্ঞতা তৈরি করে। আজকের এই ব্লগে আম...
Join discussion
Mar 4, 2025 · 4 min read · Transforms are helpful in transforming data into our required format or validating data before processing into SailPoint or processing from SailPoint to target applications. To learn more about transforms have a look on sailpoint offical documentatio...
Join discussionJan 2, 2025 · 4 min read · If there is one commonality between successful people, and winners, it is rising before dawn. Studies show that people who are early risers tend to be more successful than night owls. The mantra to succeed is simple, "Wake up at five, and do it!" Dis...
Join discussion
Dec 28, 2024 · 3 min read · 잠깐! transform에 대해 아직 잘 모른다면 [CSS] 변환 행렬을 먼저 읽어보세요! 상황에 따라 동적으로 뷰포트에 대한 transform-origin의 좌표를 구해야 할 수 있습니다. 대상이 변환이 수행되지 않은 경우라면 getBoundingClientRect를 사용해 쉽게 구할 수 있습니다. 하지만 변환이 수행된 경우는 생각보다 까다롭습니다. 차근차근 살펴보도록 하겠습니다. 우선 변환이 고려되지 않은 상황, 그중에서도 대상 영역에 대...
Join discussion
Dec 21, 2024 · 2 min read · 이번 편은 이전 편으로부터 이어집니다. 전편에서는 transform의 원리와 주요 변환 행렬에 대해 소개했습니다. 이번 편에서는 이를 사용하면서 흔히 범할 수 있는 오류에 대해 다룹니다. 좌측에서 우측으로? 우측에서 좌측으로? transform: rotate(90deg) skewX(45deg); 어떻게 동작하실 것 같은가요? \(90^\circ\)를 뒤집었으니 사실상 회전하지 않은 거나 다름없을 테고 거기다 \(x\)축을 따라 \(45^\c...
Join discussion
Dec 14, 2024 · 3 min read · CSS에서는 요소의 이동이나 크기, 회전을 조절하기 위한 transform 속성이 있습니다. 이는 내부적으로 변환 행렬을 통해 처리합니다. 변환 행렬을 사용하면 요소의 변환을 비교적 간단하게 수행할 수 있습니다. 변환 행렬 변환 행렬이란 변환에 대한 행렬 표현입니다. 여기서 변환이란 함수라 생각해 주시면 됩니다. 즉, 함수의 행렬 표현 정도로 보시면 되겠네요. 행렬이 어떻게 함수의 역할을 할 수 있을까요? 함수가 무엇인가요? 기능 측면에서 접근...
Join discussion
Jul 15, 2024 · 1 min read · In unity there are these questions related to Transform and GameObject, such as, Which one to return as parameter? Which one to receive as a serialized field from Editor? Here goes the simple reference points to make the decision What you get wit...
Join discussionJul 8, 2024 · 8 min read · Centering elements in web development is a common task that can sometimes be tricky to achieve. One powerful and versatile method to accomplish this is by using the CSS transform property. In this article, through straightforward steps and explanatio...
Join discussion