气泡式对话框在Web页面上如今也十分普及和常见,对话框中三角形的朝向关键在于before伪元素的定位,接下来我们就来看一下使用CSS绘制基础的对话框图案的代码示例

如下图：左侧三角形 css代码如下： CSS Code复制内容到剪贴板 #talkbubble {        margin-left:30px;       width: 120px;        height: 80px;        background: red;       position: relative;       -moz-border-radius:    10px;        -webkit-bo