带有CSS的M形边框？ [复制]答案

【问题标题】：M shaped border with css? [duplicate]带有CSS的M形边框？ [复制]
【发布时间】：2014-10-22 01:42:17
【问题描述】：

我可以通过两种方式在两侧绘制直线，使用 span 标签或伪代码前后。但问题是中间部分，我不知道如何在 css 的帮助下完成它。不想包含图片。

HTML：

<span class="simple-border"></span>
<div class="arrow-down"></div>
<span class="simple-border"></span>

CSS：

.arrow-down {
    width: 0; 
    height: 0; 
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;

    border-top: 20px solid #ccc;
}

【问题讨论】：

这是我 7 天前第三次面临这样的问题。
例如：stackoverflow.com/questions/26472289/…
如果不想使用:before或:after添加边框可以使用这个jsfiddle.net/victor_007/0q4ogweq
@VitorinoFernandes 没有比这更好的了 :) 非常感谢，你是男人

标签： css

【解决方案1】：

您需要在 CSS 中使用 :before 和 :after 选择器来创建有角度的边框。这篇文章应该让你开始......

http://css-tricks.com/snippets/css/css-triangle/

【讨论】：