htmlcss画梯形,css怎么画梯形？
在html⽹页设计中，常会结合css绘制⼀些简单的形状，那么使⽤css该如何画梯形呢？下⾯我们来看⼀下使⽤css画梯形的⽅法。
css绘制梯形的⽅法：
1. 利⽤border加粗⽅式
这是⽹上较为常见的⽅式，其原理就是对⼀个⾼度为0px的正⽅形的div的border-top进⾏增粗。
理解代码：
建⽴⼀个div,⾼度为0，宽度400px(可以理解为⼀个矩形，但矩形的⾼度为0，⾃然这个矩形就这垂直⽅向压缩成了⼀条线)，div上边界粗度或厚度设为100px且为实线，左右边界线厚度也为100px，但设为透明(利⽤了css的transparent属性)
2. 利⽤3d旋转和透视3d旋转和透视⽅式
div border属性
这种⽅式是对div进⾏旋转和透视操作，最终形成⼀个梯形。
理解代码：
设置宽⾼及背景颜⾊不再多说，这⾥主要⽤到transform属性transform: perspective(2em) rotateX(-10deg); perspective：对元素进⾏透视操作
rotateX：以x轴(横轴)进⾏旋转(前后仰俯)

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。