多种漂亮的纯CSS会话气泡

多种漂亮的纯CSS会话气泡410
气泡是一个受欢迎的会话效果。本教程包含了各种形式的气泡。
没有图片,没有JavaScript,它可以应用于现有的语义HTML。

演示中使用的CSS文件页面大量注释,以便您可以看到这行代码负责每个部分的影响。
.triangle-isosceles {
   position:relative;
   padding:15px;
   margin:1em 0 3em;
   color:#000;
   background:#f3961c;
 
   /* css3 */
   -moz-border-radius:10px;
   -webkit-border-radius:10px;
   border-radius:10px;
   background:-moz-linear-gradient(top, #f9d835, #f3961c);
   background:linear-gradient(top, #f9d835, #f3961c);
}
 
/* s triangle */
.triangle-isosceles:after {
   content:"\00a0";
   display:block; /* reduce the damage in FF3.0 */
   position:absolute;
   z-index:-1;
   bottom:-30px;
   left:50px;
   width:0;
   height:0;
   border-width:15px 15px;
   border-style:solid;
   border-color:#f3961c transparent transparent;
}

也许你还喜欢