Thursday, February 27, 2020

Simple Tooltip use

CODE:

<!DOCTYPE html>
<html>
    <head>
        <title>Simple tooltip task</title>
        <style>
            div{border-bottom: 1px dotted red;
            width: 230px; height: 50px;padding: 20px;
            display: inline-block; position: absolute;}

            div span{ visibility: hidden; width: 120;
            background-color: red;color: white;
            text-align: center; z-index: 1;}

            div:hover span{visibility: visible;}
        </style>
    </head>
    <body>
        <div>Hover over me.<br/>
            <span>This is simple division tag in html.</span>
        </div>
    </body>

</html>

OUTPUT:

No comments:

Post a Comment

Simple Example of div tag in html with css

HTML and CSS Code : <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <m...