body {
font-family:Arial;
font-size:14px
}
h1 {
margin-bottom:10px;
}
.tooltip {
display: inline;
position: relative;
}
.tooltip:hover:after {
background-color: #000000;
background-color: rgba(0, 0, 0, 0.85);
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
bottom: 26px;
color: #FFFFFF;
content: attr(data-tooltip-text);
left: 20%;
padding: 5px 10px;
position: absolute;
width: 130px;
z-index: 1000;
}
.tooltip:hover:before {
border: solid;
border-color: rgba(0, 0, 0, 0.85) transparent;
border-width: 8px 8px 0 8px;
bottom: 18px;
content: "";
left: 50%;
position: absolute;
z-index: 1001;
}

<div id="demo">
<h1>Giới thiệu các môn học thiết kế web Online</h1>
<p>Chuyên Viên Website Lành Nghề Online</p>
<p>Lập trình <a href=" http://hocwebgiare.com/dao-tao-online/Lap-trinh-HTML5-CSS3-RWD-Javascript-Online.html&quot; data-tooltip-text="Hypertext Markup Language Version 5" class="tooltip">HTML5</a> / <a href=" http://hocwebgiare.com/dao-tao-online/Lap-trinh-HTML5-CSS3-RWD-Javascript-Online.html&quot; data-tooltip-text="Cascading Style Sheets Level 3" class="tooltip">CSS3</a> / <a href=" http://hocwebgiare.com/dao-tao-online/Lap-trinh-HTML5-CSS3-RWD- Javascript-Online.html" data-tooltip-text="Responsive Web Design" class="tooltip">RWD</a> / JS Online
</p>
<p>Thiết kế giao diện website Online</p>
<p>Lập Trình <a href=" http://hocwebgiare.com/dao-tao-online/Lap-trinh- PHP-Co-Ban-Online.html" data-tooltip-text="HyperText Preprocessor" class="tooltip">PHP </a> Cơ Bản Online
</p>
</div>