Hướng dẫn tạo nút bottom contact đẹp bằng html không cần sử dụng js


Coppy đoạn code dưới đây và paste vào trước thẻ đóng body của footer


<!-- Contact bottom -->
	<div class="contact-cs">
		<div class="zalo">
			<a href="https://zalo.me/0974438896" target="_blank">
				<span class="tooltip-cs">Chat zalo</span>
				<img src="http://nhatweb.vn/wp-content/uploads/2023/04/Zalo.svg"/>
			</a>
		</div>
		<div class="messenger">
			<a href="https://www.facebook.com/messages/t/215427065761277" target="_blank">
				<span class="tooltip-cs">Chat messenger</span>
				<img src="http://nhatweb.vn/wp-content/uploads/2023/04/messenger.png"/>   
			</a>
		</div>
		<div class="whatapp">
			<a href="https://wa.me/+84974438896" target="_blank">
				<span class="tooltip-cs">Chat whatapp</span>
				<img src="http://nhatweb.vn/wp-content/uploads/2023/04/whatsapp.png"/>
			</a>
		</div>
		<div class="call">
			<a href="tel:+84974438896" target="_blank">
				<span class="tooltip-cs">Liên hệ chúng tôi</span>
				<img src="http://nhatweb.vn/wp-content/uploads/2023/04/call.png"/>
			</a>
		</div>
	</div>
	<style>
		.contact-cs img {
			width: 45px;
			border-radius: 50%;
			border: solid 2px #fff;
			box-shadow: 0px 1px 2px rgb(0 0 0 / 8%), 0px 1px 3px rgb(0 0 0 / 5%);
			margin-bottom: 10px;
			background:#fff;
		}
		.contact-cs {
			position: fixed;
			z-index: 2;
			display: block;
			bottom: 90px;
			right: 23px;
			float: right !important;
		}
		.contact-cs a {
			float: right;
			display: flex;
			align-items: center;
		}
		.contact-cs a:hover {
			scale: 1.1;
		}
		span.tooltip-cs {
			background: #000000eb;
			padding: 10px 15px;
			color: #fff;
			font-size: 12px;
			border-radius: 5px;
			line-height: 12px;
			margin-bottom: 10px;
			position: absolute;
			width: max-content;
			right: 50px;
			display:none;
		}
		span.tooltip-cs:after {
			content: "";
			width: 8px;
			height: 8px;
			background: #090701;
			right: -4px;
			position: absolute;
			transform: rotate(45deg);
		}
		a:hover span.tooltip-cs {
			display:inherit;
		}
	</style>
<!--End contact bottom-->

Chat zalo
Chat whatapp
Liên hệ chúng tôi