কম্পিউটার টিউটোরিয়াল

CSS দিয়ে ডান পাশে টুলটিপ সেট করুন


ডান পাশে টুলটিপ সেট করতে left CSS প্রপার্টি ব্যবহার করুন।

টেক্সটের ডান পাশে টুলটিপ সেট করতে নিচের কোডটি চালাতে পারেন:

উদাহরণ

<!DOCTYPE html> <html>    <style>       .mytooltip .mytext {          visibility: hidden;          width: 140px;          background-color: blue;          color: #fff;          z-index: 1;          top: -6px;          left: 100%;          text-align: center;          border-radius: 6px;          padding: 5px 0;          position: absolute;       }       .mytooltip {          position: relative;          display: inline-block;       }       .mytooltip:hover .mytext {          visibility: visible;       }    </style>    <body>       <div class = "mytooltip">Keep mouse cursor over me          <span class = "mytext"> My Tooltip text</span>       </div>    </body> </html>

  1. CSS দিয়ে উপরে টুলটিপ সেট করুন

  2. CSS অ্যানিমেশন দিয়ে ফেড-ইন টুলটিপ তৈরি করুন

  3. CSS দিয়ে টুলটিপের ডান পাশে তীর তৈরি করুন

  4. CSS দিয়ে টুলটিপের উপরে তীর তৈরি করুন