在主要内容下方形成形状的最佳方法是什么？

Question

我有一个响应式设计，如下图所示

在左侧复制此形状的最佳方法是什么？我可以使用img吗？或者我应该把它作为background images？或者将它用作css形状？

Answer 1

您可以使用线性渐变

＆＃13;

＆＃13;

.box{
width:200px;
height:350px;
background:white;
background: -moz-linear-gradient(125deg, red 30%, white 30%);
background: -webkit-linear-gradient(125deg, red 30%, white 30%);
background: -o-linear-gradient(125deg, red 30%, white 30%);
background: -ms-linear-gradient(125deg, red 30%, white 30%);
background: linear-gradient(125deg, red 30%, white 30%);
border: 1px solid #ccc;
}

＆＃13;

<div class="box"></div>

＆＃13;

＆＃13;

＆＃13;