本文介绍了CSS3变换为梯形的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我需要使用div元素创建一个CSS3梯形。为了使我清楚我在做什么,我已经创建了一个基本的视觉下面;绿色是一个正常的矩形div,而红色代表我需要改变div以获得我需要的梯形形状的部分。
I need to create a CSS3 trapezoid using a div element. To make it crystal clear what I'm doing I've created a basic visual below; green is a normal rectangular div while the red represents the parts I need to change the div to in order to achieve the trapezoid shape I need.
我们正在编辑 .trapezoid {}
CSS类什么是我需要实现的形状? (显然颜色只是参考)。
Provided that we're editing .trapezoid {}
CSS class what are the rules I need to achieve the shape? (Obviously the color is just reference).
推荐答案
尝试:
.trapezoid { transform: perspective(600px) rotateY(-45deg) scale(1.1,1.1); }
根据需要调整值。
这篇关于CSS3变换为梯形的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!