CSS を使用した不規則な正方形の形状の作成
CSS を使用して、提供された画像に描かれている独特の形状を実現するには、回転と透視変換の組み合わせを使用します。採用されている。次のコード スニペットは、その方法を示しています。
<code class="css">.box { width: 150px; height: 120px; background: #f540a8; margin: 20px; transform: perspective(180px) rotateX(15deg) rotateY(20deg) rotateZ(-3deg); }</code>
<code class="html"><div class="box"></div></code>
説明:
これらの変換を組み合わせることで、正方形の形状が歪んで傾き、図に示すような不規則な形状になります。参考画像
以上がCSS 変換を使用して不規則な正方形を作成する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。