第一个框上withCSS的箭头不可见。如何使箭头可见？

我的问题类似于这个问题：Arrow Box with CSS，但我需要对齐多个框css 对话框箭头css 对话框箭头，而不是只对齐一个框。并且仍然可以看到所有盒子上的箭头。

在这个例子中：，我创建了两个向左浮动的箭头框。问题是第一个框上的箭头不可见。

如何使箭头可见？

css三角形箭头_css 对话框箭头_css 在边框上画箭头

HTML：

复制

css 在边框上画箭头_css三角形箭头_css 对话框箭头

CSS：

<pre class="prism-token token language-javascript">`.arrow {

float: left;
width: 128px;
height: 100px;
background-color: #f0f0f0;
border: 1px solid #999;
position: relative;

}
.arrow:after {

content: &#x27;&#x27;;
position: absolute;
top: 0px;
left: 128px;
width: 0;
height: 0;
border: 50px solid transparent;
border-left: 12px solid #f0f0f0;

}
.arrow:before {

content: &#x27;&#x27;;
position: absolute;
top: 0px;
left: 129px;
width: 0;
height: 0;
border: 50px solid transparent;
border-left: 12px solid #999;
pre>

复制

文章由官网发布，如若转载，请注明出处：https://www.veimoz.com/1485

css css 对话框箭头 css 在边框上画箭头 css三角形箭头

0 评论

662