📌  相关文章
📜  如何使用 HTML 和 CSS 绘制梯形？

📅  最后修改于: 2021-10-31 05:35:16             🧑  作者: Mango

梯形是具有两条平行边和两条不平行边的四边形。在本文中，我们将使用简单的 HTML 和 CSS创建一个梯形形状。

HTML 代码：在本节中，我们将使用 HTML div标签创建一个简单的元素。

HTML



  
  
  Trapezium

 

  
  

css

HTML


 

  
  
  Trapezium
 
  

 

  


 

CSS 代码：在本节中，我们将首先使用一些基本的 CSS 属性设计 div元素，然后使用 border-bottom、border-left和border-right属性来创建梯形形状。

css

Final Code：是上面两个代码段的组合。

HTML 



 

  
  
  Trapezium
 
  

 

  


 

输出：