How to stilize title property css

/* use for any tag on your page */
[data-title]:hover:after {
    opacity: 1;
    transition: all 0.1s ease 0.5s;
    visibility: visible;
}
/* box for title text */
[data-title]:after {
    content: attr(data-title);
  	/* position for title view box */
  	position: absolute;
  	bottom: -1.6em;  	
    left: 100%;
    z-index: 99999;
    visibility: hidden;
    /* optional */
    white-space: nowrap;
  	/* stilization */
    background-color: #00FF00;
    color: #111;
    font-size: 150%;
    padding: 1px 5px 2px 5px;
    box-shadow: 1px 1px 3px #222222;
    opacity: 0;
    border: 1px solid #111111;
}
[data-title] {
    position: relative;
}

/* on html page in your tags */
/* 
<a href="example.com" data-title="My site"> Link </a> with styled tooltip (bigger and with a different background color, as requested in the question)<br/>
<a href="example.com" title="My site"> Link </a> with normal tooltip
*/

Source: stackoverflow.com

Similar codes

3 votes205 views5 answers
India
CSS
0 vote187 views2 answers
Deployer custom Options
CSS
54 votes183 views3 answers
Center align an image css
CSS
0 vote180 views1 answer
Align grid items with end
CSS
4 votes164 views3 answers
Webkit
CSS
71 votes178 views6 answers
Css center image
CSS
24 votes162 views3 answers
Css change multiple classes
CSS
23 votes200 views5 answers
How to rotate image in css
CSS
6 votes173 views3 answers
.row bootstrap
CSS
0 vote174 views1 answer
Place-content css property
CSS