Chèn 4 nút liên hệ cố định vào chân trang web

Thứ hai - 01/04/2024 04:31
Chèn 4 nút liên hệ cố định vào chân trang web
HTML:
<section class="mobile_chat hidden-md hidden-lg">
	<div class="container">
		<div class="row codfe_row">
			<div class="col-xs-3 chat-item">
				<a href="tel:0888037777" class="chat-item-url">
					<div class="chat-item-image">
					<img src="https://trinhloc.com/uploads/blog/2024/icon_phone.png" class="img-responsive" alt="goi-dien">
					</div>
					<div class="chat-item-text">
						Gọi điện
					</div>
				</a>
			</div>
			<div class="col-xs-3 chat-item">
				<a href="sms:0888037777" class="chat-item-url">
					<div class="chat-item-image">
					<img src="https://trinhloc.com/uploads/blog/2024/icon_sms.png" class="img-responsive" alt="nhan-tin">
					</div>
					<div class="chat-item-text">
						Nhắn tin
					</div>
				</a>
			</div>
			<div class="col-xs-3 chat-item">
				<a href="http://zalo.me/0888037777" class="chat-item-url">
					<div class="chat-item-image">
					<img src="https://trinhloc.com/uploads/blog/2024/icon_zalo.png" class="img-responsive" alt="chat-zalo">
					</div>
					<div class="chat-item-text">
						Chat Zalo
					</div>
				</a>
			</div>
			<div class="col-xs-3 chat-item">
				<a href="https://www.messenger.com/t/https://www.facebook.com/th.baoloc/">
					<div class="chat-item-image">
					<img src="https://trinhloc.com/uploads/blog/2024/icon_fb.png" class="img-responsive" alt="facebook">
					</div>
					<div class="chat-item-text">
						Facebook
					</div>
				</a>
			</div>
		</div>
	</div>
</section>


CSS:
<style>
.codfe_row{
   display: flex;
}
.mobile_chat {
    background: #fff;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    box-shadow: #ebebeb 0 0 20px;
}
.chat-item {
    padding: 5px 10px;
}
.col-xs-3 {
    width: 25%;
}
.chat-item a {
    display: block;
}
.chat-item .chat-item-image {
    width: 100%;
    float: left;
}
.chat-item .chat-item-image {
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.chat-item .chat-item-image img {
    height: 32px;
}
.chat-item .chat-item-text {
    width: 100%;
    float: left;
}
.chat-item .chat-item-text {
    height: 20px;
    font-size: 11px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.chat-item .chat-item-text {
    width: 100%;
    float: left;
}
.chat-item .chat-item-text {
    height: 20px;
    font-size: 11px;
    display: flex;
    justify-content: center;
    align-items: center;
}
</style>
 

Tổng số điểm của bài viết là: 5 trong 1 đánh giá

Xếp hạng: 5 - 1 phiếu bầu
Click để đánh giá bài viết

Tên miền Việt Nam

Tên miền Việt Nam Lệ phí đăng ký(1) (không chịu thuế) Phí duy trì(2) (không chịu thuế) Dịch vụ tài khoản quản trị tên miền năm đầu (chưa bao gồm thuế VAT) Dịch vụ tài khoản quản trị tên miền năm tiếp theo (chưa bao gồm thuế VAT) Tổng tiền năm...

Thống kê
  • Đang truy cập8
  • Máy chủ tìm kiếm1
  • Khách viếng thăm7
  • Hôm nay4,144
  • Tháng hiện tại49,404
  • Tổng lượt truy cập8,133,648
Bạn đã không sử dụng Site, Bấm vào đây để duy trì trạng thái đăng nhập. Thời gian chờ: 60 giây