怎样用CSS做出这个效果？

Question

或者用什么方法比较简单呢 用svg图标但是中间放不了文字

Answer 1

偷懒的办法就是让ui把那个对话框的图片切给你，不偷懒的话就自己用div模拟一下就行，div+三角形+定位就可以了

Answer 2

利用三角形就可以了！.bubble {            position: relative;            padding: 8px 16px;            background: #f7f7f7;            border: 1px solid #ccc;        }        .bubble:before {            content: '';            position: absolute;            display: block;            bottom : -10.5px;            right: 0;            width: 0;            height: 0;            border-top: 12px solid #f7f7f7;            border-left: 12px solid transparent;            z-index: 10;        }        .bubble:after {            content: '';            position: absolute;            display: block;            bottom : -13px;            right: -1px;            width: 0;            height: 0;            border-top: 13px solid #ccc;            border-left: 13px solid transparent;        }