或者用什么方法比較簡單呢 用svg圖標但是中間放不了文字
怎樣用CSS做出這個效果？
慕的地8271018
2018-07-06 19:13:51
3 回答
明月笑刀無情
TA貢獻1828條經(jīng)驗 獲得超4個贊
利用三角形就可以了！
.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;
? ? ? ? }
- 3 回答
- 0 關(guān)注
- 411 瀏覽
添加回答
舉報
0/150
提交
取消