Chat
Danh mục
Cách tạo thông báo ấn tượng cho website bằng CSS

Cách tạo thông báo ấn tượng cho website bằng CSS

Số lượng:
Thêm vào giỏ
Cách tạo thông báo ấn tượng cho website bằng CSS đã được thêm vào giỏ hàng

 Không cần phải dùng đến hình ảnh, bạn vẫn có thể tạo được những thông báo đẹp mắt cho website với những tính năng của CSS.

Bắt đầu thủ thuật:

Bước 1:Bạn vào Bảng điều khiển - Bố cục - tạo 1 Html/javarscript sau đó paste hết code bên dưới vào:
<!---Code ChipKool---->
<style type="text/css">
.chat-bubble {  
  background-color:#EDEDED;  
  border:2px solid #666666;  
  font-size:15px;  
  line-height:1.3em;  
  margin:10px auto;  
  padding:10px;  
  position:relative;  
  text-align:center;  
  width:300px;  
  -moz-border-radius:10px;  
  -webkit-border-radius:10px;  
  -moz-box-shadow:0 0 5px #888888;  
  -webkit-box-shadow:0 0 5px #888888;  
}  
.chat-bubble-arrow-border {  
  border-color: #666666 transparent transparent transparent;  
  border-style: solid;  
  border-width: 10px;  
  height:0;  
  width:0;  
  position:absolute;  
  bottom:-22px;  
  left:30px;  
}  
.chat-bubble-arrow {  
  border-color: #EDEDED transparent transparent transparent;  
  border-style: solid;  
  border-width: 10px;  
  height:0;  
  width:0;  
  position:absolute;  
  bottom:-19px;  
  left:30px;  
}  
</style>


<div class="chat-bubble">  
    Cảm ơn các bạn đã ghé thăm chipkool! Chúc các bạn một ngày vui vẻ :)  
  <div class="chat-bubble-arrow-border"></div>  
  <div class="chat-bubble-arrow"></div>  
</div>

Bước 2:Bạn muốn thay đổi dòng thông báo thì sửa dòng Cảm ơn các bạn đã ghé thăm chipkool! Chúc các bạn một ngày vui vẻ :)  

Bước 3:Save widget lại

chúc bạn thành công!!