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

CSS দিয়ে টুলটিপের বাম পাশে তীর তৈরি করুন


টুলটিপের ডান পাশে তীর যোগ করতে right CSS প্রপার্টি ব্যবহার করুন।

টুলটিপের বাম পাশে তীর যুক্ত করতে নিচের কোডটি চালাতে পারেন:

উদাহরণ

<!DOCTYPE html> <html>    <style>       .mytooltip .mytext {          visibility: hidden;          width: 140px;          background-color: blue;          color: #fff;          z-index: 1;          top: -5px;          left: 110%;          text-align: center;          border-radius: 6px;          padding: 5px 0;          position: absolute;       }       .mytooltip {          position: relative;          display: inline-block;          margin-left: 50px;       }       .mytooltip .mytext:after {          content: "";          position: absolute;          top: 50%;          right: 100%;          margin-top: -5px;          border-width: 6px;          border-style: solid;          border-color: transparent blue transparent transparent;       }       .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 left প্রপার্টি অ্যানিমেট করুন

  4. CSS দিয়ে ফ্লোটিং এলিমেন্টস