সিএসএস প্রদর্শন সম্পত্তি বোঝা যাচ্ছে

লেখক: Louise Ward
সৃষ্টির তারিখ: 12 ফেব্রুয়ারি. 2021
আপডেটের তারিখ: 18 মে 2024
Anonim
4 মিনিটে সিএসএস ডিসপ্লে প্রপার্টি শিখুন
ভিডিও: 4 মিনিটে সিএসএস ডিসপ্লে প্রপার্টি শিখুন

কন্টেন্ট

এটা মধ্যরাত, এবং এটি ডিভ আপনার সাইটে এখনও সন্তানের খেলনা বুকের মতো দেখাচ্ছে। সমস্ত উপাদান হ'ল বিড়বিড় করে ফেলেছে এবং প্রতিবার আপনি সিএসএসের সাথে খেলেন প্রদর্শন সম্পত্তি, তারা একটি সম্পূর্ণ ভিন্ন বিট বোকা নিজেকে পুনর্বিন্যস্ত।

আপনি যদি আমার মতো হন তবে আপনার শ্বাসের নিচে বিচলিত হয়ে এবং আপনার কীবোর্ডের সাথে ধারাবাহিকভাবে আরও আক্রমণাত্মক হয়ে আপনি সম্ভবত এটি সমাধান করবেন। যদিও এই কৌশলটি আমার পক্ষে আগে কাজ করেছে, আমি সম্প্রতি এটির আরও ভাল উপায় বোঝার জন্য বেরিয়েছি প্রদর্শন সম্পত্তি

এটি এর বেসিকগুলি বের করে দেয় প্রদর্শন আমি মূলত যা ভাবি তার চেয়ে অনেক সহজ। আসলে, তারা স্যুটকেস প্যাকিংয়ের মতো একই নীতিগুলি ব্যবহার করে। আমি কভার করতে যাচ্ছি প্রদর্শন ব্লক, ইনলাইন-ব্লক এবং সারিতে। আপনি যদি আগে সুশৃঙ্খলাটি সুশৃঙ্খলভাবে সাজিয়ে রেখেছেন তবে আপনি সমান্তরাল দেখতে পাবেন। যদি আপনি এমন লোকের মতো হন যা আপনার সমস্ত পোশাককে একটি হাফিজার্ড পদ্ধতিতে ভেঙে দেয় - ভাল, আমি আপনার পক্ষে কেবল এত কিছু করতে পারি।


আমাদের স্যুটকেসে তিন ধরণের পোশাক থাকবে:

  • কোলাড শার্টের মতো ডিলিকেটস
  • টি-শার্টগুলি পাকানো যায়
  • মোজা বা আন্ডারওয়্যার যা ফাঁক করা যায়

রেফারেন্সের জন্য, যদি আমরা এইচটিএমএলে স্যুটকেস মডেল করি তবে এটি দেখতে এটির মতো হবে:

ডিভ ক্লাস = 'স্যুটকেস'> ডিভ ক্লাস = 'ডেলিকেট' </ div> ডিভ ক্লাস = 'টিশার্ট' </ div> ডি ক্লাস = 'tshirt' </ div> ডিভ ক্লাস = 'tshirt'> </ div> ডিভ ক্লাস = 'tshirt' </ div> ডিভ শ্রেণি = 'মোজা'> </ div> বিভাগ = 'tshirt' </ div> বিভাগ = 'tshirt'> </ div> বিভাগ = 'tshirt'> </ div> ডিভ শ্রেণি = 'tshirt' </ div> / div>

উপরে সূক্ষ্ম আইটেম

প্রদর্শন ব্লক বেশিরভাগ এইচটিএমএল উপাদানগুলির জন্য এটি ডিফল্ট। তার অর্থ উপাদানটি তার ধারকটির মধ্যে পুরো অনুভূমিক স্থানটি দখল করে ডিভ। যদি এটি অন্যান্য ভাইবোন উপাদানগুলির পাশে থাকে তবে এটি একটি নতুন লাইন শুরু করবে এবং তার লাইনে অন্য উপাদানগুলিকে অনুমতি দেবে না। এটি আপনার স্যুটকেসের শীর্ষে রাখা সূক্ষ্ম আইটেমের সমান। এগুলি কোলার্ড শার্টের মতো সূক্ষ্ম বা স্মার্ট নিবন্ধ। আপনি চাইছেন না যে এগুলি কুঁচকে গেছে, তাই আপনি নিশ্চিত হন যে তারা অন্য পোশাকের বিরুদ্ধে চাপছেন না।


এটি এর মধ্যে সবচেয়ে শক্ততম অংশ নিয়ে আসে প্রদর্শন ব্লক। লক্ষ্য করুন কীভাবে কোলাড শার্ট স্যুটকেসের পুরো প্রস্থটি দখল করে না? এর অর্থ এই নয় যে অন্যান্য আইটেমগুলি তার স্তরে উঠে যাবে। ধরা যাক এই শার্টটি স্যুটকেসের প্রস্থের 60 শতাংশ; এটি এখনও অন্যান্য স্তরের সাথে এটি শীর্ষ স্তরে যোগদান করতে বাধা দেবে।

সে কারণেই ছবিতে কমলা রঙের সীমানা রয়েছে। ক প্রদর্শন ব্লক উপাদানটি যদি পুরো অনুভূমিক স্থানটি দখল না করে তবে স্বয়ংক্রিয়ভাবে এটির চারপাশে একটি মার্জিন যুক্ত হবে।

ঝরঝর করে প্যাক করা টি-শার্ট

আপনার ভ্রমণের জন্য আপনার বেশিরভাগ স্যুটকেস সম্ভবত আপনার বাকী পোশাক পূর্ণ। সরলতার জন্য, আমরা এটি কেবল টি-শার্টে কেটে যাচ্ছি। ভাঁজ বা ঘূর্ণায়মান আরও দক্ষ কিনা তা নিয়ে ইন্টারনেটে একটি বড় বিতর্ক রয়েছে। আমি ভাঁজ ধরণের ব্যক্তি।


যাইহোক, সর্বাধিক আইটেম ফিট করার জন্য, আপনি পাশাপাশি আপনার টি-শার্ট লাইন করুন। ঠিক এই কি প্রদর্শন: ইনলাইন-ব্লক জন্য বোঝানো হয়। এই উপাদানগুলি একই লাইনে একে অপরের পাশে পাশাপাশি পাশাপাশি বসতে পারে প্রদর্শন: ইনলাইন উপাদান।

অপছন্দনীয় প্রদর্শন: ইনলাইন উপাদান, একটি ইনলাইন-ব্লক উপাদানটি এতে থাকা খাপ খায় না হলে উপাদানটি পরবর্তী লাইনে চলে যাবে ডিভ অন্য পাশাপাশি ইনলাইন-ব্লক উপাদান। পরের সারিতে টি-শার্ট ছড়িয়ে পড়ার জন্য, আপনাকে এটিটি অর্ধেক কেটে নতুন সারি শুরু করতে বাকি অর্ধেকটি ব্যবহার করতে হবে। ইনলাইন-ব্লক উপাদানগুলিকে যদি কোনও লাইনে না মানায় তবে অর্ধেকে বিভক্ত হওয়ার অনুমতি নেই।

মোজা যে শূন্যস্থান পূরণ করে

আসল এইচটিএমএলটিতে ফিরে দেখুন এবং আপনি লক্ষ করবেন যে একটি মোজা রয়েছে ডিভ> আট টি-শার্টের মধ্যে তবে ডানদিকে স্যুটকেসের অনুভূমিক দৃশ্যটি একবার দেখুন। যদি একটি মোজা থাকে ডিভ>, এটি কীভাবে মধ্য সারিটি শেষ করে নীচের সারিটি শুরু করতে পারে? এটিই এর উদ্দেশ্য প্রদর্শন: ইনলাইন

একটি সারিতে এটির প্রস্থ অতিক্রম করলে উপাদানটি পরবর্তী লাইনে ছড়িয়ে পড়বে ডিভ (এইভাবে এটি থেকে পৃথক ইনলাইন-ব্লক বা ব্লক)। আমাদের মোজা যেহেতু ডিভ মোজা পূর্ণ যা ফাঁকা ফাঁকে ফাঁকে ফাঁকে ফাঁকে ফাঁকে ফাঁকে ফাঁকে ফাঁকে ফাঁকে ফাঁকে ফাঁকে ফাঁকে ফাঁকে ফাঁকে ফাঁকা করা যায়, এটি সহজেই মধ্য সারিটির ডানদিকে ফাঁক দেওয়া শুরু করতে পারে এবং নীচের সারিটি শুরু করতে ছড়িয়ে পড়ে।

এটি হওয়ার জন্য কোনও মোজা অর্ধেক কাটা প্রয়োজন হবে না। এ কারণেই তারা হয়ে উঠতে পারে সারিতে, যদিও টি-শার্টগুলিই কেবল হতে পারে ইনলাইন-ব্লক। যদি মাঝারি সারির টি-শার্টগুলি কেবল প্রস্থের 60 শতাংশ অবধি গ্রহণ করে ডিভ> সারির বাকি অংশটি পুরো স্থান পূরণ করতে উপরে সরিয়ে নেওয়া হবে।

বন ভ্রমণ

এটি আমাদের স্যুটকেসের জন্য চূড়ান্ত সিএসএস:

.ডিলিকেট {প্রদর্শন: ব্লক; প্রস্থ: 60%; ts .শার্ট {প্রদর্শন: ইনলাইন-ব্লক; প্রস্থ: 20%; s .সোকস {প্রদর্শন: ইনলাইন; }

প্রদর্শনের বিভিন্ন ব্যবহার চিত্রিত করতে এখানে বেশ কয়েকটি বিকল্প পরিস্থিতি রয়েছে। উপরের ডিলিকেটস থাকলে প্রদর্শন: ইনলাইন-ব্লক, তারা টি-শার্টের পাশাপাশি ঠিক ফিট করবে। কিছু টি-শার্ট উপরের লাইনে উঠে যাবে এবং বাকিগুলি সেই অনুযায়ী সামঞ্জস্য করবে। কোলাড শার্টের বাম এবং ডানে কোনও আরামদায়ক বাফার থাকবে না।

প্রতিটি টি-শার্ট থাকলে প্রদর্শন ব্লক, আপনার প্রতি একে অপরের উপরে একটি টি-শার্টের বিশাল স্ট্যাক থাকবে, প্রতি লাইনে একটি করে। মোজা থাকলে প্রদর্শন: ইনলাইন-ব্লক, তারা সকলেই দুটি সারিগুলির মধ্যে প্রবাহিত না হয়ে নীচের সারিতে বসে থাকত। কিছু টি-শার্টগুলি একটি চতুর্থ লাইন তৈরি করে অন্য সারিতে চাপ দেওয়া হবে। টি-শার্টের মাঝারি সারিটির ডানদিকে একটি ফাঁক থাকবে।

আমি এখানে বর্ণিত পদ্ধতিটি দিয়ে, আমরা একটি পরিষ্কার প্যাকযুক্ত স্যুটকেস দিয়ে শেষ করি যা উপলব্ধ স্থানটির সর্বোত্তম ব্যবহার করে।

এই নিবন্ধটি মূলত উপস্থিত হয়েছিল নেট ম্যাগাজিন 289 সংখ্যা; এটি এখানে কিনতে!

শেয়ার করুন
40 টিপোগ্রাফি টুইটার অ্যাকাউন্টগুলি আপনাকে অনুসরণ করতে হবে
আরো পড়ুন

40 টিপোগ্রাফি টুইটার অ্যাকাউন্টগুলি আপনাকে অনুসরণ করতে হবে

টাইপোগ্রাফির জগতে আপনার সৃজনশীল রস প্রবাহিত করার জন্য নতুন ডিজাইন অনুপ্রেরণা, নতুন প্রকাশনা এবং দুর্দান্ত ফন্টের অভাব নেই। তবে কোথায় পাবেন?নতুন বিকাশ শীর্ষে রাখার জন্য টুইটার একটি ভাল জায়গা, তবে আপন...
এনএফটি সম্পর্কে বিভ্রান্ত? আপনার যা জানা দরকার তা আমরা ব্যাখ্যা করি
আরো পড়ুন

এনএফটি সম্পর্কে বিভ্রান্ত? আপনার যা জানা দরকার তা আমরা ব্যাখ্যা করি

এনএফটি শব্দটি ইদানীং পুরো শিরোনামে ছড়িয়ে পড়েছে, প্রায়শই কিছু অর্থের যোগাড়ের ক্ষেত্রে (আপনি কি in 69.3 মিলিয়ন ডলারের বিক্রয় সম্পর্কে শুনেছেন?) তবে আপনি হয়ত ভাবছেন যে এলোমেলো কী হচ্ছে। যদি আপনি ...
‘ফাস্ট ফুড ডিজাইন’ কি আপনার ব্যবসায়ের ক্ষতি?
আরো পড়ুন

‘ফাস্ট ফুড ডিজাইন’ কি আপনার ব্যবসায়ের ক্ষতি?

ইন্টারেক্টিভ ডিজাইন একটি জটিল এবং দুর্বল বোঝা শিল্প - সর্বোপরি, এটি কেবল কয়েক দশক পুরানো। কোনও বহিরাগতের কাছে যা কিছু সহজ, প্রযুক্তিগত প্রক্রিয়া (‘একটি ওয়েবসাইট তৈরি করুন’) বলে মনে হচ্ছে এটি আসলে প...