1. 首页
  2. 数据库
  3. 其它
  4. CSS实现带箭头的提示框效果【示例代码】

CSS实现带箭头的提示框效果【示例代码】

上传者: 2021-02-01 12:55:07上传 PDF文件 87.08KB 热度 11次
我们在很多UI框架中看到带箭头的提示框,感觉挺漂亮,但是之前一直不知道其原理,今天网上找了些资料算是弄清楚原理了; 先上效果图: 原理分析: 上面的箭头有没有觉得很像一个三角形,是的,它就是三角形;只不过它这个尖角是通过两个三角形来实现的; 首先新建一个div,画出提示框的轮廓 给定样式: .demo{ width:100px; height:100px; position:absolute; top: 35%; left:40%; bo
下载地址
用户评论