我正在设计一个单页html页面(这是主设计的简化版本。主要设计是here)。
如您所见,div(或任何其他块级元素)创建了三个(或更多)部分。
每个div的下边缘由三条相连的线组成(其中两条是对角线,另一条是实线)。
在每个部分中都可以插入任何html内容,并且它们的背景颜色未指定且可以不同。
我在网上搜索了很多,发现要创建剪切的div(框)我应该使用clip-path
新的css属性。这是非常棒的,但它是非常新的,一些浏览器(在他们的旧版本中)和IE(对我来说很重要)不支持。
甚至,通过Clippy tools,我创建了一个您可以在CodePen上看到的部分的简单设计。
如果是,我可以使用SVG制作这个方案吗?
任何人都可以帮助我,我如何设计主要浏览器支持的方案。
更新 我更改设计图片以获得更多清晰度