DIV+CSS制作箭头效果

最新推荐文章于 2024-06-22 09:56:05 发布

disufu7690

最新推荐文章于 2024-06-22 09:56:05 发布

阅读量418

点赞数

原文链接：http://www.cnblogs.com/Teresa-luo/p/4142060.html

版权

<style>
.b_main{position:absolute}
.out{
position:absolute;
top:7px;
border-color:transparent #999999 transparent transparent;
border-style:dashed dashed solid dashed;
border-width:8px;
}
.in{
position:absolute;
border-color:transparent #ffffff transparent transparent;
border-style:dashed dashed solid dashed;
border-width:8px;
top:-8px;
left:-6px;
}
.border{
position:relative;
border:1px solid #999999;
padding:10px;
left:16px;
border-radius:5px;
}
</style>
</head>
<body>
<div class="b_main">
<div class="border">效果实现^_^</div>
<div class="out">
<div class="in"></div>
</div>
</div>
</body>

http://www.jb51.net/css/143000.html

http://www.oschina.net/code/snippet_125027_3637
http://www.yuiblog.com/blog/2010/11/22/css-quick-tip-css-arrows-and-shapes-without-markup/

转载于:https://www.cnblogs.com/Teresa-luo/p/4142060.html

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
DIV+CSS制作箭头效果

<style>.b_main{position:absolute}.out{position:absolute;top:7px;border-color:transparent #999999 transparent transparent;border-style:dashed dashed solid dashed;border-width:8px;}....
复制链接

扫一扫

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。