聊天框的設計

2021-07-31 22:52:25 字數 491 閱讀 5334

經常看到這樣的尖角,

實現首先,來寫乙個簡單的**!

這兒,我們可以得到乙個黑色的正方形,其實這是邊框組成的,因為div的寬度和高度都是0,。那麼,我們具體來看看,div寬度和高度都是0時,它的上下左右四邊框都是怎樣的,下面我們把邊框的各邊顏色分別設定為不同顏色:

我們發現,原來當div的寬度和高度都是0的時候,它的整個邊框是由四個三角形組成的,每一邊為乙個三角形,那麼我們就可以利用這個特點,來做可愛的小尖角了。我們只要把不需要的三邊的邊框(三角形)的顏色設定為與背景相同即可,這樣就只能看到你想要的那個三角形了,然後再利用定位調整一下位置就可以了。具體**如下所示:

氣泡聊天框

好久沒寫部落格了。今天給大家分享乙個氣泡聊天框。div speech div.speech before div.speech after div.speech right div.speech right before div.speech right after div.speech left ...

Unity NGUI製作聊天框

今天和大家分享一下滾動條和文字做成的聊天框 新建乙個sprite 新增box collider scroll bar script 設定屬性upscroll bar direction toptobottom 把sprite拖拉到background裡面 size 0.1 新建乙個子sprite 把...

vue聊天框傳送表情

1.在傳送訊息的時候,判斷傳送的訊息是不是表情,表情的type 3,content 愛心 這樣儲存在資料庫中 2.在獲取聊天記錄的時候,判斷type 3,處理表情,else if chatitem.type 3 src emojiurl emojimap chatitem.content style...