创建 css3 特定形状答案

【问题标题】：creating css3 specific shape创建 css3 特定形状
【发布时间】：2017-05-12 15:20:19
【问题描述】：

我尝试使用 css3 创建中间 V 截面形状，这可能吗？此模式将用作页脚的背景和响应式布局。所以我尽量避免直接使用图片。

【问题讨论】：

标签： html css

【解决方案1】：

div {
  background-color: red;
  width: 100%;
  height: 50px;
  position: relative;
  text-align: center;
}

span {
  position: absolute;
  background color: #fff;
  width: 20px;
  height: 20px;
  top: -10px;
  background-color: #fff;
  transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  /* IE 9 */
  -webkit-transform: rotate(45deg);
  /* Chrome, Safari, Opera */
}

&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;

【讨论】：

太棒了，我需要的。一个问题，你是怎么这么快生成这个的？

【解决方案2】：

是的，你可以。但我强烈建议您改用图像。但如果你坚持，你可以参考这里。

https://css-tricks.com/examples/ShapesOfCSS/

【讨论】：

我主要担心的是位置上的图像会不同于我想要的分辨率变化