摘要：
在聊天的场景中，聊天内容需要用到气泡修饰，如下图。下面一一讲解。 图片式： 第一个样式是京东客服，气泡的圆角和钩子都是用了图片。使用了一个table组合成了一个圆角的框框。lm样式拼出了钩子。 样式： 背景式： 第二种主要是使用了：before伪类画出了三角形，然后用定位拼在了一起。 样式： 更多三 阅读全文
摘要：
气泡框（或者提示框）是网页中一种很常见的元素，大多用来展示提示信息，如下图所示： 拆分来看，形如这种气泡框无外乎就是一个矩形框+一个指示方向的三角形小箭头，要制作出这样的气泡框，如果解决了三角形小箭头就容易了。一种方法就是制作这样一个三角形箭头的图片，然后定位在矩形框上。但这种解决办法在后期更改气泡 阅读全文
摘要：
无论是提示框还是导航栏都能看到如上图所示的带有箭头的框框，这种箭头可以通过背景图片或者是css来实现，本文介绍三种通过css实现带箭头的提示框。 1.通过border属性 思路：两个三角形，通过定位使两个三角形相差1px作为边框。 2.CSS3 transfrom 思路：先做一个两条边相同颜色的正方 阅读全文
摘要：
效果图如下： 源码： 阅读全文