CSS聊天氣泡是操作網頁樣式的重要組成部分。基于易語言的開發，聊天氣泡可以通過使用CSS樣式效果來實現。以下是如何設計和制作聊天氣泡的例子。

/*樣式設置*/
.chatbubble {
position: relative;
padding: 8px;
border-radius: 10px;
background-color: #3D3D3D;
color: white;
font-size: 18px;
width: 300px;
margin: 10px;
}
.chatbubble:after {
content: '';
position: absolute;
border-style: solid;
border-width: 10px 16px 10px 0;
border-color: transparent #3D3D3D;
display: block;
width: 0;
z-index: 1;
right: -16px;
top: 10px;
}
.chatbubble:before {
content: '';
position: absolute;
border-style: solid;
border-width: 11px 17px 11px 0;
border-color: transparent #FFFFFF;
display: block;
width: 0;
z-index: 0;
right: -17px;
top: 9px;
}
.chatbubble-left {
float: left;
margin-left: 10px;
}
.chatbubble-left:before, .chatbubble-left:after {
right: auto;
left: -16px;
border-color: transparent #FFFFFF;
}
.chatbubble-right {
float: right;
margin-right: 10px;
}
.chatbubble-right:before, .chatbubble-right:after {
border-color: transparent #3D3D3D;
}

以上CSS樣式代碼可以用來實現左右兩側聊天氣泡的顯示效果。其中，.chatbubble類規定氣泡的位置和樣式，使用偽元素:after和:before為氣泡添加右側三角形效果。.chatbubble-left和.chatbubble-right類分別為左右兩側氣泡設置樣式。

在HTML文件中，可以使用以下代碼來設置氣泡的內容和位置：

左側氣泡
右側氣泡

根據實際情況，在上述代碼基礎上可以添加更多的屬性和樣式效果，以配合網頁的整體設計風格。