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

HTML/CSS-এ DIV-এর নিচে কেন্দ্রে ট্রায়্যাঙ্গেল (Triangle) বানানোর পদ্ধতি

CSS Border ট্রিক দিয়ে ট্রায়্যাঙ্গেল

বর্ডার প্রোপার্টি ব্যবহার করে CSS-এ ট্রায়্যাঙ্গেল বানানো যায়। DIV-এর নিচে কেন্দ্রে রাখতে ::after পseudo-এলিমেন্ট ব্যবহার করুন।

CSS


ব্যাখ্যা

  • left: 50% + transform: translateX(-50%) → নিশ্চিতভাবে অনুভূমিক কেন্দ্র।
  • border-top রঙ দিয়ে, বাম/ডান বর্ডার ট্রান্সপেরেন্ট → নিচে মুখী ট্রায়্যাঙ্গেল।
  • bottom: 0 → DIV-এর নিচে সংযুক্ত।

উপরি মুখী ট্রায়্যাঙ্গেল চাইলে

            
  1. HTML ডকুমেন্টে CSS ইনক্লুড করা

  2. CSS দিয়ে মেনু আইকন (Hamburger Menu) তৈরি করা

  3. ফ্লেক্সবক্স দিয়ে অ্যাডভান্সড CSS লেআউট

  4. শুধু CSS ব্যবহার করে স্মুথ স্ক্রোলিং বাস্তবায়ন করা