2010-01-17 96 views
2

我已经创建了一个本质上大的箭头指向右侧。下载CSS三角形阴影

<div style=" 
font-size: 0px; line-height: 0%; width: 100px; 
border-bottom: 80px solid #8cb622; 
border-right: 62px solid #dadbdf; 
"></div> 


<div style=" 
font-size: 0px; line-height: 0%; width: 100px; 
border-top: 80px solid #8cb622; 
border-right: 62px solid #dadbdf; 
"></div> 

现在我知道这不是“正确的”,但我现在只是在测试。

我想知道是否有一种方法可以使用此边框技术,并且仍然以某种方式在箭头的底部边缘放置投影。我正在考虑在其下放置另一个div,但为了使这种技术起作用,其他边框需要可见。

如果这不能使用边界技术完成,我不得不使用图像作为这个箭头的前面。

感谢

回答

0

您可能需要考虑使用Canvas来做到这一点,该平台非常适合与MSIE兼容的ExplorerCanvas跨平台工作(当然在WebKit & Gecko中本地支持)。

+0

嗯,画布标签看起来可能会有所诀窍。我对这个标签没有经验,因此可能需要一些学习。 – user103219 2010-01-17 01:31:58

0

我相信这是box-shadow但很可能会承担它的工作原理包装盒上的型号和可能不会计算在边界创建的几何。

+0

不幸的是,它似乎做了整个div,因为我有点期待。 – user103219 2010-01-17 01:21:53