কোডল্যাব: CSS-এ সেন্টারিং

অ্যাডাম আর্গিল

এই কোডল্যাব আপনাকে CSS-এ কেন্দ্রীভূত করার আপনার পছন্দের উপায় শেয়ার করতে এবং প্রদর্শন করতে সেট আপ করে।

CSS-এ কেন্দ্রীভূত করার জন্য আমার প্রিয় 5টি উপায় সম্পর্কে জানতে আমার ব্লগ পোস্টটি দেখুন। অথবা এই ভিডিও দেখুন!

সেটআপ

  1. প্রকল্পটিকে সম্পাদনাযোগ্য করতে সম্পাদনা করতে রিমিক্সে ক্লিক করুন৷
  2. app/index.html খুলুন
  3. line 23 , /* your centering CSS here /* আপনার CSS দিয়ে প্রতিস্থাপন করুন
  4. (ঐচ্ছিক) আপনার কেন্দ্রীকরণ কৌশলটির নাম দিন এবং <h1> এ পাঠ্যটি প্রতিস্থাপন করুন

শৈলী

  1. app/css/ ফোল্ডারে একটি নতুন ফাইল তৈরি করুন
  2. .turbo-center বা [floaty-mcfloat] এর মতো আপনার কেন্দ্রীভূত সমাধান ধরে রাখতে একটি নির্বাচক তৈরি করুন
  3. সেই নতুন নির্বাচকের মধ্যে, আপনার কেন্দ্রীকরণ কৌশলটি লিখুন (অন্যের app/css/ উদাহরণ হিসাবে নির্দ্বিধায় দেখুন)
  4. (ঐচ্ছিক) কিছু "সহায়তা শৈলী" লিখুন যাতে আমরা দেখতে পারি যে শিশুদের কেন্দ্রে সমর্থন করার জন্য কোন স্টাইল প্রয়োজন
  5. app/css/index.css খুলুন এবং নীচে আপনার নতুন ফাইল আমদানি করুন

সব বেঁধে দাও

  1. আবার app/index.html খুলুন
  2. <article> খুঁজুন এবং এটিকে আপনার কাস্টম সিলেক্টর দিন যা আপনি পূর্ববর্তী বিভাগের ধাপ #2 এ তৈরি করেছেন।
  3. আপনার ত্রুটি আমাকে টুইট করুন এবং আমি এটি ব্লগ পোস্টে ফিচার করব!