每当讨论到对话气泡时，无数的用户界面用途就会浮现出来。这些可以用于处理讨论评述，或者创建公告版，或者显示引用文本。只需将下面的类加入你的样式表，你也可以从这贴 CSS3代码片段，找到相关的HTML代码。
- .chat-bubble {
- background-color: #ededed;
- border: 2px solid #666;
- font-size: 35px;
- line-height: 1.3em;
- margin: 10px auto;
- padding: 10px;
- position: relative;
- text-align: center;
- width: 300px;
- -moz-border-radius: 20px;
- -webkit-border-radius: 20px;
- -moz-box-shadow: 0 0 5px #888;
- -webkit-box-shadow: 0 0 5px #888;
- font-family: 'Bangers', arial, serif;
- }
- .chat-bubble-arrow-border {
- border-color: #666 transparent transparent transparent;
- border-style: solid;
- border-width: 20px;
- height: 0;
- width: 0;
- position: absolute;
- bottom: -42px;
- left: 30px;
- }
- .chat-bubble-arrow {
- border-color: #ededed transparent transparent transparent;
- border-style: solid;
- border-width: 20px;
- height: 0;
- width: 0;
- position: absolute;
- bottom: -39px;
- left: 30px;
- }
转载请注明：TUTERM.COM » CSS3对话气泡特效
