How to Add Target Tooltip with Title HTML and Css in Blogger

DEMO 

Hover over me

Steps

Copy this Code 

    
     span[title] {
  position: relative;
  cursor: pointer;
}

span[title]:hover:after {
  content: attr(title);
  position: center;
  background-image: url("https://upload.wikimedia.org/wikipedia/commons/4/4a/Color_changing_gradient_rainbow.gif");
  color: #fff;
  padding: 5px 10px;
  border-radius: 50px;
  -webkit-box-shadow: 0px 20px 0px -10px #FFFFFF, 0px -20px 0px -10px #FFFFFF, 20px 0px 0px -10px #FFFFFF, -20px 0px 0px -10px #FFFFFF, 0px 0px 0px 10px #FF0000, 13px 7px 50px 5px rgba(255,63,20,0); 
box-shadow: 0px 20px 0px -10px #FFFFFF, 0px -20px 0px -10px #FFFFFF, 20px 0px 0px -10px #FFFFFF, -20px 0px 0px -10px #FFFFFF, 0px 0px 0px 10px #FF0000, 13px 7px 50px 5px rgba(255,63,20,0);
 z-index: 1;
}

    
  

Copy This Code

    
     
 <span title="This is a tooltip">Hover over me</span>
    
  

Thanks You!!

Contact for Any Problem