Javascript 需要有关html5画布的帮助吗

我不是HTML css的专业人士，我有一个HTML转换的设计。我读过canvas，但我不知道如何满足我的要求。我搜索了很多，但没有什么非常有用的

这是我的设计：

它是一个旗帜区，由三部分组成

横幅图像汽车图片 透明三角型div 还有导航菜单 我只是想知道如何创建这个三角形类型的div，因为我不知道

所以请给我一个有用的解决方案。我非常感谢你

---

注意：这也是一种响应性的方法。

我的建议是将导航与旋转的div分开，正如@krisph所说的，您只需要在该div上应用一个变换：旋转45度并保持固定。然后应用变换：在每个正方形点上旋转45度。我想你甚至不需要使用画布

您可以使用“transform:rotate12deg；”在你的css中，但是你必须记住对你的文本做相反的处理我知道我看起来很需要，但是如果我的答案对你来说是可以的，你可能会接受吗@迪米