আসসালামু আলাইকুম।আশা করি আপনারা ভালো আছেন।আমি হাজির হলাম আরো একটি নতুন পোষ্ট নিয়ে।আমি যা শেয়ার করবো তা আপনি যানলে আমি বলবো এই পোষ্ট আপনার জন্য না।

আজ আমি আপনাদের অনেক কিছু Triangle এবং Arrow সম্পর্কে কথা বলবো।যারা ওয়েবসাইট ডিজাইন করে থাকে তাদের জন্য অনেক ধরকারি এসব জিনিন।

আজকের পোষ্ট এ যে Triangle গুলো থাকবে।


1. Triangle Right


2. Triangle Left


3. Triangle Down


4. Triangle Up


5. Oval


6. Circle


আজকের পোষ্ট যে Arrow গুলো থাকবে।


1. Down arrow


2. Up arrow


3. Left arrow


4. Right arrow


যেহেতু এসব CSS দ্বারা তৈরি তাই কোড এর সাথে সাথে Example ও থাকবে।

1. Triangle Right

Code:
Example:

2. Triangle Left

Code:

Example:

3. Triangle Down

Code:
Example:

4. Triangle Up

Code:
Example:

5. Oval

Code:

Example:

6. Circle

Code:
Example:


1. Down arrow

Code:

<span style=”border: solid black;border-width:0 3px 3px 0;
display: inline-block; padding:3px;transform: rotate(45deg); -webkit-transform: rotate(45deg);”></span>

Example:

2. Up arrow

Code:

<span style=”transform: rotate(-135deg); -webkit-transform: rotate(-135deg);border: solid black;border-width:0 3px 3px 0;
display: inline-block; padding:3px;”></span>

Example:

3. Left arrow

Code:

<span style=”transform: rotate(135deg); -webkit-transform: rotate(135deg);border: solid black;border-width:0 3px 3px 0;
display: inline-block; padding:3px;”></span>

Example:

4. Right arrow

Code:

<span style=”transform:rotate(-45deg); -webkit-transform:rotate(-45deg);border: solid black;border-width:0 3px 3px 0;
display: inline-block; padding:3px;”></span>

Example:

তো বন্ধুরা আজ এই পর্যন্তই।দেখা হবে আরো কোনো পোষ্ট এ।আমার যা জানানোর ছিল তা জানালাম আপনাদের।যদি পোষ্টটি ভালো লাগে তাহলে লাইক এবং কমেন্ট করুন।আর যেকোনে নতুন বিষয়ে জানতে ট্রিকবিডি সাথে থাকুন।

14 thoughts on "এখন CSS দিয়ে তৈরি করুন অসাধারণ Triangle and Arrows অনেক সহজে।"

  1. MD Musabbir Kabir Ovi Author says:
    ভালো লিখেছেন
    1. ༻═୧୨ஓ๑♡๑ஓ୧୨═༺ Author Post Creator says:
      ধন্যবাদ, আপনার মূলবান মতামতের জানানোর জন্য।
  2. Shamim Author says:
    খুব কার্যকর বিষয়
    1. ༻═୧୨ஓ๑♡๑ஓ୧୨═༺ Author Post Creator says:
      জি। ধন্যবাদ মতামত জানানোর জন্য।
  3. MD Rakib Mia says:
    কোডগুলো সুন্দর করে দেন এভাবে কপি করা যাচ্ছে না
    1. ༻═୧୨ஓ๑♡๑ஓ୧୨═༺ Author Post Creator says:
      ভালো করেই তো দিয়েছি।বক্সের মধ্যে ।আর পরের কোড গুলো বক্সের মধ্যে দিতে পারি নি কারণ কোড বক্সের মধ্যে দেওয়ার পর কিছু কোড উদাও হয়ে যাচ্ছে তাই নিচের কোডগুলো এভাবে দিয়েছি।
  4. Ashraful Author says:
    Darun. Carry on.
    1. ༻═୧୨ஓ๑♡๑ஓ୧୨═༺ Author Post Creator says:
      ধন্যবাদ।
    1. ༻═୧୨ஓ๑♡๑ஓ୧୨═༺ Author Post Creator says:
      যারা ওয়েবসাইট ডিজাইন করে থাকে তারা ঠিকিই বুঝে।
  5. Levi Author says:
    এগুলোর কাজ কি?আদৌ কোনো লাভ হবে??
    1. ༻═୧୨ஓ๑♡๑ஓ୧୨═༺ Author Post Creator says:
      অবশ্যাই লাভ হবে।যারা ওয়েবসাইট ডিজাইন করে তাদের অনেক কাজে দেবে এই কোডগুলো।

Leave a Reply