CSS3 の遠近法変換で台形を作成できますか?

台形作成のための CSS3 の利用

質問:

Google モバイルにある魅力的な台形要素のエミュレートを追求していますSafari のホームページで、開発者が CSS3 を活用するためのガイダンスを求めています。

答え:

CSS Transform Perspective

堅牢なソリューションとして登場した CSS Transform Perspective は、開発者が操作できるようにします。 3次元空間内の要素。遠近法と回転を適用すると、長方形要素を台形に簡単に変換できます:

.trapezoid {
  width: 200px;
  height: 200px;
  background: red;
  transform: perspective(10px) rotateX(1deg);
  margin: 50px;
}

HTML:

<div class="trapezoid"></div>

以上がCSS3 の遠近法変換で台形を作成できますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。