CSS ইনস্ট্যান্স
- পূর্ববর্তী পৃষ্ঠা CSS গ্রিড আইটেম
- পরবর্তী পৃষ্ঠা CSS টেস্ট
CSS চিহ্নিতকারী
CSS ব্যবহার
CSS প্রক্ষেপ
CSS ঘিণ্টি
- চারটি বর্তনীর প্রশস্ততা সংযোজন
- উপরের বর্তনীর প্রশস্ততা সংযোজন
- নিচের বর্তনীর প্রশস্ততা সংযোজন
- বামদিকের বর্তনীর প্রশস্ততা সংযোজন
- ডানদিকের বর্তনীর প্রশস্ততা সংযোজন
- চারটি বর্তনীর শৈলী সংযোজন
- উপরের বর্তনীর শৈলী সংযোজন
- নিচের বর্তনীর শৈলী সংযোজন
- বামদিকের বর্তনীর শৈলী সংযোজন
- ডানদিকের বর্তনীর শৈলী সংযোজন
- চারটি বর্তনীর রঙ সংযোজন
- উপরের বর্তনীর রঙ সংযোজন
- নিচের বর্তনীর রঙ সংযোজন
- বামদিকের বর্তনীর রঙ সংযোজন
- ডানদিকের বর্তনীর রঙ সংযোজন
- সকল বর্তনী অ্যাট্রিবিউট একটি ঘোষণাতে
- เพิ่มโค้งขอบเขตให้กับองค์ประกอบ
- প্রত্যেক পাশের বর্তনী নির্ধারণ
- সকল উপরের বর্তনী অ্যাট্রিবিউট একটি ঘোষণাতে
- সকল নিচের বর্তনী অ্যাট্রিবিউট একটি ঘোষণাতে
- সকল বামদিকের বর্তনী অ্যাট্রিবিউট একটি ঘোষণাতে
- সকল ডানদিকের বর্তনী অ্যাট্রিবিউট একটি ঘোষণাতে
CSS মাঝামাঝি
- বস্তুর প্রত্যেক পাশের মার্গিন নির্ধারণ
- চারটি মানের সংক্ষিপ্ত margin অ্যাট্রিবিউট ব্যবহার
- তিনটি মানের সংক্ষিপ্ত margin অ্যাট্রিবিউট ব্যবহার
- দুটি মানের সংক্ষিপ্ত margin অ্যাট্রিবিউট ব্যবহার
- একটি মানের সংক্ষিপ্ত margin অ্যাট্রিবিউট ব্যবহার
- মার্গিন auto করে, কনটেনারের মধ্যের ইউনিটকে কেন্দ্রীভূত করুন
- পিতৃত্বভূত ইউনিটের ডানদিকের মার্গিন উত্তরাধিকার
- মার্গিন মিলিতকরণ
CSS অভ্যন্তরীণ মাঝামাঝি
- বস্তুর প্রত্যেক পাশের ইনার স্পেসিং নির্ধারণ
- চারটি মানের সংক্ষিপ্ত ইনার স্পেসিং ব্যবহার
- তিনটি মানের সংক্ষিপ্ত ইনার স্পেসিং ব্যবহার
- দুটি মানের সংক্ষিপ্ত ইনার স্পেসিং ব্যবহার
- একটি মাত্র মানের সংক্ষিপ্ত ইনার স্পেসিং ব্যবহার
- ইনার স্পেসিং ও বস্তুর প্রশস্ততা (বক্স-সাইজিং না সংযোজন)
- ইনার স্পেসিং ও বস্তুর প্রশস্ততা (বক্স-সাইজিং সংযোজন)
- বস্তুর বামদিকের ইনার স্পেসিং সংযোজন
- বস্তুর ডানদিকের ইনার স্পেসিং সংযোজন
- বস্তুর উপরের ইনার স্পেসিং সংযোজন
- বস্তুর নিচের ইনার স্পেসিং সংযোজন
CSS উচ্চতা/প্রশস্ততা
CSS বক্স মডেল
CSS প্রদর্শন
CSS লিখন
CSS ফন্ট
CSS লিঙ্ক
CSS তালিকা
CSS ট্যাবল
- table, th এবং td উপাদানের কালো হোল্ডার নির্ধারণ করুন
- border-collapse ব্যবহার করুন
- টেবিলের একটি হোল্ডার বর্তমান
- টেবিলের প্রস্থ এবং উচ্চতা নির্ধারণ করুন
- অভ্যন্তরীণ প্রদর্শন (text-align) সেট করুন
- অভ্যন্তরীণ প্রদর্শন (vertical-align) সেট করুন
- th এবং td উপাদানের অভ্যন্তরীণ প্যাডিং নির্ধারণ করুন
- হোরিজন্টাল সেপারেটর
- হলোকিং টেবিল
- বার্ডার টেবিল
- টেবিল হোল্ডারের রঙ নির্ধারণ করুন
- টেবিল শিরোনামের অবস্থান সেট করুন
- রেসপনসিভ টেবিল
- সুন্দর টেবিল তৈরি করুন
CSS প্রদর্শন
CSS লোকেশন
- উপাদানকে ব্রাউজার উইন্ডোর সাথে সম্পর্কে সেট করুন
- উপাদানকে উপাদানের স্বাভাবিক অবস্থানের সাথে সম্পর্কে সেট করুন
- অবস্থানকে অবস্থানকারী অবস্থানে সেট করুন
- চিকনা লোকেশন
- মিলিত উপাদান
- উপাদানের আকৃতি সেট করুন
- পিক্সেল মান দিয়ে ছবির উপরের সীমানা সেট করুন
- পিক্সেল মান দিয়ে ছবির নিচের সীমানা সেট করুন
- পিক্সেল মাপকাঠিতে চিত্রের বামদিকের সীমানা সংযোজন
- পিক্সেল মাপকাঠিতে চিত্রের ডানদিকের সীমানা সংযোজন
- চিত্র এবং লেখা অবস্থান (বামদিকের উপরের কোণ)
- চিত্র এবং লেখা অবস্থান (ডানদিকের উপরের কোণ)
- চিত্র এবং লেখা অবস্থান (বামদিকের নিচের কোণ)
- চিত্র এবং লেখা অবস্থান (ডানদিকের নিচের কোণ)
- চিত্র এবং লেখা অবস্থান (মধ্যের অবস্থান)
CSS অতিরিক্ত
- overflow: visible - অতিরিক্ত কাটা না, তবে তা ইলেকট্রনিক বক্সের বাইরে রেন্ডার করা হয়
- overflow: hidden - অতিরিক্ত কাটা হয়, কিন্তু বাকি সামগ্রী সরবরাহ করা হয় না
- overflow: scroll - অতিরিক্ত কাটা হয়, কিন্তু সরবরাহ করুন এবং বাকি সামগ্রী দেখাতে সরবরাহ করুন
- overflow: auto - যদি অতিরিক্ত কাটা হয়, তবে সর্বদা সরবরাহ করুন এবং বাকি সামগ্রী দেখাতে সরবরাহ করুন
- overflow-x এবং overflow-y ব্যবহার করুন
CSS ফ্লোটিং
- float ধর্মের সরল ব্যবহার
- সীমাবদ্ধ এবং মাপকাঠিতে বাহ্যিক মাপকাঠিতে ফ্লোটিং
- শিরোনামসহ চিত্রকে ডান দিকের ফ্লোটিং
- আনুষ্ঠানিক শব্দকে বাম দিকের ফ্লোটিং
- ফ্লোটিং বন্ধ করুন (clear ধর্ম ব্যবহার করে)
- ফ্লোটিং বন্ধ করুন (clearfix hack ব্যবহার করে)
- ফ্লোটিং বক্স তৈরি করুন
- সমানভাবে অবস্থিত চিত্র তৈরি করুন
- একই উচ্চতা বক্স তৈরি করুন (flexbox দ্বারা)
- হলচ্যুত মেনু তৈরি করুন
- web ব্যুত্তি তৈরি করুন
CSS inline-block
CSS সামান্য সামান্য
- বাহ্যিক মাপকাঠিতে মধ্যের অবস্থান
- লেখাকে মধ্যের অবস্থান
- চিত্রকে মধ্যের অবস্থান
- position দ্বারা বাম/ডানদিকের সামান্য সামান্য
- position দ্বারা বাম/ডানদিকের সামান্য সামান্য - বহুমুখী প্ল্যাটফর্ম প্ল্যান
- float দ্বারা বাম/ডানদিকের সামান্য সামান্য
- float দ্বারা বাম/ডানদিকের সামান্য সামান্য সামান্য - বহুমুখী প্ল্যাটফর্ম প্ল্যান
- padding দ্বারা উপরের মধ্যের অবস্থান
- উপরের এবং বাম মধ্যের অবস্থান
- line-height দ্বারা উপরের মধ্যের অবস্থান
- position দ্বারা উপরের এবং বাম মধ্যের অবস্থান
CSS সমন্বয়কারী
CSS প্রত্যক্ষ প্রকার
CSS প্রত্যক্ষ উপাদান
CSS Content Generation
CSS অস্তিত্ব
CSS নেভিগেশন বার
CSS Dropdown List
CSS ছবি স্পিরিট
CSS অতিক্রম চিহ্নিতকারী
- Select all <a> elements with target attribute
- Select all <a> elements with target="_blank" attribute
- Select all elements with title attributes containing a space-separated list of words, one of which is "flower"
- Select all elements with class attribute values starting with "top" (must be the whole word)
- Select all elements with class attribute values starting with "top" (must not be the whole word)
- Select all elements with class attribute values ending with "test"
- Select all elements with class attribute values containing "te"
CSS ফর্ম
CSS ওয়েবসাইট সাজাকরণ
CSS বৃত্তাকার
CSS ঘিণ্টি ছবি
CSS প্রক্ষেপ
CSS গ্রেডেন্ট
- กระบวนการสีเปลี่ยนทางตรง - จากบนไปด้านล่าง
- กระบวนการสีเปลี่ยนทางตรง - จากซ้ายไปขวาง
- กระบวนการสีเปลี่ยนทางตรง - มุมตัด
- กระบวนการสีเปลี่ยนทางตรง - มุมที่กำหนด
- กระบวนการสีเปลี่ยนทางตรง - สีที่มีหลายตำแหน่ง
- กระบวนการสีเปลี่ยนทางตรง - สีสันเทาที่มีข้อความ
- กระบวนการสีเปลี่ยนทางตรง - ความโปร่งใส
- กระบวนการสีเปลี่ยนทางตรง - กระบวนการสีเปลี่ยนทางตรงที่ซ้ำกัน
- กระบวนการสีเปลี่ยนทางทรงเหลี่ยม - ตำแหน่งสีที่แช่งเท่าๆ
- กระบวนการสีเปลี่ยนทางทรงเหลี่ยม - ตำแหน่งสีที่มีระยะห่างต่าง ๆ
- กระบวนการสีเปลี่ยนทางทรงเหลี่ยม - กำหนดรูปร่าง
- กระบวนการสีเปลี่ยนทางทรงเหลี่ยม - คำที่ใช้ในขนาดต่าง ๆ
- กระบวนการสีเปลี่ยนทางทรงเหลี่ยม - กระบวนการสีเปลี่ยนทางทรงเหลี่ยมที่ซ้ำกัน
กระบวนการเงา CSS
- กระบวนการเงาง่ายๆ
- เพิ่มสีให้กับเงา
- เพิ่มเชิงมัวให้กับเงา
- ข้อความขาวในเงาดำ
- เงาทางเหลืองที่มีเงาเปิด
- เงาทางเหลืองและสีน้ำเงินที่มีเงาเปิด
- ข้อความขาวในเงาดำ สีน้ำเงินและสีน้ำเงินเข้ม
- เพิ่ม box-shadow ง่ายๆ ให้กับองค์ประกอบ
- เพิ่มสีให้กับ box-shadow
- เพิ่มสีและเชิงมัวให้กับ box-shadow
- สร้างบนบนองค์ประกอบเหมือนใบแบตเตอร์้ย์ (ข้อความ)
- สร้างบนบนองค์ประกอบเหมือนใบแบตเตอร์้ย์ (รูปภาพโบลีย์เลย์)
CSS লিখন প্রভাব
สายอักษร web CSS
CSS 2D ট্রান্সফর্ম
CSS 3D ট্রান্সফর্ম
CSS ট্রান্সিশন
CSS অ্যানিমেশন
CSS টুলটিপ
CSS শৈলীতে চিত্র
- বোল্ডার দিয়ে চিত্র
- বুটা চিত্র
- সংক্ষিপ্ত চিত্র
- লিঙ্ক হিসাবে সংক্ষিপ্ত চিত্র
- সাধারণ ব্রেকপইন্ট
- চিত্র লেখা (বাম ওপরে কোণে)
- চিত্র লেখা (ডান ওপরে কোণে)
- চিত্র লেখা (বাম নিচে কোণে)
- চিত্র লেখা (ডান ওপরে কোণে)
- চিত্র লেখা (মধ্যে স্থাপিত)
- পলারয়া চিত্র
- গ্রেশিয়ার চিত্র
- অগ্রণী - CSS এবং JavaScript-এর মাধ্যমে চিত্র মোডাল
CSS Object-fit
CSS বাটন
CSS পেজিনেশন
CSS মাল্টিকলাম
- মাল্টিকলাম তৈরি করুন
- কলামগুলির মধ্যে মধ্যবর্তী জায়গা নির্ধারণ
- কলামগুলির মধ্যে সীমানা শৈলী নির্ধারণ
- কলামগুলির মধ্যে সীমানা আকার নির্ধারণ
- কলামগুলির মধ্যে সীমানা রঙ নির্ধারণ
- কলামগুলির মধ্যে সীমানা রঙ, শৈলী এবং আকার নির্ধারণ
- ইলেমেন্টকে কতটি কলাম দিয়ে অতিক্রম করতে হবে নির্ধারণ
- কলামগুলির সুপারিশিত উপযুক্ত প্রস্থ নির্ধারণ
CSS ইউজার ইন্টারফেস
CSS ভেরিয়েবল
CSS বক্স সাইজিং
CSS ফ্লেক্সবক্স
- তিনটি ফ্লেক্সবক্স আইটেম
- তিনটি ফ্লেক্সবক্স আইটেম - rtl দিশা
- flex-direction - row-reverse
- flex-direction - column
- flex-direction - column-reverse
- justify-content - flex-end
- justify-content - center
- justify-content - space-between
- justify-content - space-around
- align-items - stretch
- align-items - flex-start
- align-items - flex-end
- align-items - center
- align-items - baseline
- flex-wrap - nowrap
- flex-wrap - wrap
- flex-wrap - wrap-reverse
- align-content - center
- ফ্লেক্সবক্স আইটেম ক্রমবিন্যাস
- Margin-right:auto;
- Margin:auto; = ভালো কেন্দ্রীভূত
- ফ্লেক্সবক্স আইটেমের উপর align-self সেট করুন
- ফ্লেক্সবক্স আইটেমের দৈর্ঘ্য নির্ধারণ, সম্পূর্ণ ফ্লেক্সবক্স আইটেমের তুলনায়
- ফ্লেক্সবক্স দিয়ে রেসপনসিভ ইমেজ লাইব্রেরি তৈরি করুন
- ফ্লেক্সবক্স দিয়ে রেসপনসিভ ওয়েবসাইট তৈরি করুন
CSS মিডিয়া কোয়াইয়ার
CSS 媒体查询 - 更多实例
- 根据屏幕宽度设置不同的背景色
- স্ক্রিন প্রস্থতা অনুযায়ী ব্যাকগ্রাউন্ড রঙ সেট
- রেসপন্সিভ নেভিগেশন মেনু
- ফ্লোটিং দ্বারা রেসপন্সিভ কলাম
- ফ্লেক্সবক্স দ্বারা রেসপন্সিভ কলাম
- মিডিয়া কোয়াইয়ারের মাধ্যমে এলিমেন্ট লুকানো
- রেসপন্সিভ ফন্ট সাইজ
- রেসপন্সিভ ইমেজ লাইব্রেরি
- রেসপন্সিভ ওয়েবসাইট
- ব্রাউজার দিকনির্দেশক অনুযায়ী পৃষ্ঠা সাজানো
ইনস্ট্যান্স ব্যাখ্যা: CSS মিডিয়া কোয়াইয়ার ইনস্ট্যান্স
ইনস্ট্যান্স ব্যাখ্যা: CSS রেসপন্সিভ ওয়েব ডিজাইন
- পূর্ববর্তী পৃষ্ঠা CSS গ্রিড আইটেম
- পরবর্তী পৃষ্ঠা CSS টেস্ট
