我发现这个很酷的例子是border-color的透明属性用法来制作一个箭头.
我理解如何绘制边框以及带有一侧边框的空元素如何帮助实现箭头效果,但是在这个例子中让我徘徊的是使用透明.
看看这个简单的代码:
我理解如何绘制边框以及带有一侧边框的空元素如何帮助实现箭头效果,但是在这个例子中让我徘徊的是使用透明.
看看这个简单的代码:
<div id="daniel"></div>
CSS:
#daniel{ border-color: rgba(111,111,0.2) transparent transparent; border-style: solid; border-width: 15px; position: absolute; }
使用此代码,我得到一个指向下方的箭头. (JSFIDDLE)
border-color: rgba(111,0.2) transparent;
令我困惑的是不知道border- {side}透明在这个速记属性中引用了什么.
希望有道理.
任何帮助赞赏.
谢谢