সিএসএসে কীভাবে ব্লক তৈরি করবেন

সুচিপত্র:

সিএসএসে কীভাবে ব্লক তৈরি করবেন
সিএসএসে কীভাবে ব্লক তৈরি করবেন

ভিডিও: সিএসএসে কীভাবে ব্লক তৈরি করবেন

ভিডিও: সিএসএসে কীভাবে ব্লক তৈরি করবেন
ভিডিও: How to Create a Blog Site Within 15 Minutes - কিভাবে ব্লগ ওয়েব সাইট তৈরি করবেন 2024, নভেম্বর
Anonim

সিএসএস একটি ক্যাসকেডিং স্টাইল শীট যা ওয়েব পৃষ্ঠাগুলির উপস্থিতি বর্ণনা করার জন্য একটি ভাষা a সিএসএসের অন্যতম প্রধান সুবিধা হ'ল ব্লক বিন্যাসের সাথে সারণী বিন্যাস প্রতিস্থাপনের ক্ষমতা।

সিএসএসে কীভাবে ব্লক তৈরি করবেন
সিএসএসে কীভাবে ব্লক তৈরি করবেন

এটা জরুরি

এইচটিএমএল কোড সম্পাদক

নির্দেশনা

ধাপ 1

প্রথম ব্লক তৈরি করুন। এইচটিএমএল আকারে এটি 'block01' আইডি সহ একটি ডিভ ট্যাগের মতো দেখাবে। এখানে, block01 শনাক্তকারী ইঙ্গিত দেয় যে সিএসএস বর্ণনায়, এই ব্লকের সমস্ত বৈশিষ্ট্য # block01 নির্বাচকের জন্য নির্দিষ্ট করা আছে।

ধাপ ২

সিএসএসে ব্লকটি বর্ণনা করুন। সিএসএস শৈলীতে শনাক্তকারীটির নাম উল্লেখ করুন (# block01) এবং কোঁকড়ানো ধনুর্বন্ধনীতে এর পরামিতিগুলি - প্রস্থ, অবস্থান, অফসেট, ব্যাকগ্রাউন্ড রঙ ইত্যাদি বর্ণনা করে উদাহরণস্বরূপ, এটি এর মতো দেখতে পারে: # block01 {প্রস্থ: 150px; উচ্চতা: 150px; অবস্থান: পরম; শীর্ষ: 0 পিএক্স; বাম: 0 পিক্স; পটভূমি রঙ: গোলাপী}। এই বিবরণটি ধরে নিয়েছে যে বাক্সটি 150 পিক্সেল দীর্ঘ এবং 150 পিক্সেল প্রশস্ত হবে, এটি ডকুমেন্টের উপরের বাম কোণে দৃly়ভাবে অবস্থান করবে এবং এর পটভূমিটি গোলাপী বর্ণের হবে।

ধাপ 3

ব্লকে একটি আপেক্ষিক অবস্থান দিন। আপনি যদি সিএসএস বিবরণে পরম নয়, তবে আপেক্ষিক অবস্থান ব্যবহার করেন তবে আপনি স্থানাঙ্কের গ্রিডে কড়া নাড়ি দিয়ে ব্লক স্থাপন করতে পারেন, তবে ইতিমধ্যে বিদ্যমান অন্যান্য ব্লকের সাথে আপেক্ষিক। এটি করতে কোডের অবস্থানটি পরিবর্তন করুন: পরম; শীর্ষ: 0 পিএক্স; বাম: অবস্থান অনুসারে 0 px: আপেক্ষিক; শীর্ষ: 200px; বাম: 100px।

পদক্ষেপ 4

ব্লকটিকে একটি বৃত্তাকার দিন। সিএসএসে সীমানা-ব্যাসার্ধের বিবৃতি এর জন্য দায়ী। আপনার স্টাইলশীটে নিম্নলিখিত কোডটি যুক্ত করুন: সীমানা ব্যাসার্ধ: 8px। ব্লকে এখন গোলাকার কোণ থাকবে। আপনি যদি কেবল কয়েকটি কোণে গোল করতে চান তবে তাদের প্রত্যেকের জন্য পৃথক ব্যাসার্ধটি বর্ণনা করুন: সীমানা-ব্যাসার্ধ: 8px 8px 0px 0px।

পদক্ষেপ 5

ব্লক একটি স্ট্রোক দিন। একটি পাতলা রেখা সহ একটি ব্লকের আউটলাইনটি হাইলাইট করতে, নিম্নলিখিত সিএসএস বর্ণনায় কোডটি যুক্ত করুন: সীমানা শীর্ষ: 1px ড্যাশড কালো। এই নির্দেশের অর্থ ব্লকের সীমানা কালো হবে এবং বেধে এক পিক্সেল হবে। এই ক্ষেত্রে, কনট্যুর লাইনটি নিজেই ড্যাশড লাইন হিসাবে প্রদর্শিত হবে (ড্যাশড - একটি বিন্দুযুক্ত লাইন, বিন্দু - বিন্দু, কঠিন - একটি শক্ত রেখা)।

পদক্ষেপ 6

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

পদক্ষেপ 7

আপনি একের পর এক ব্লকের প্রবাহ কাস্টমাইজ করতে ভাসা সম্পত্তি ব্যবহার করতে পারেন। যদি আপনি এটিকে "বামে" সেট করেন, তবে বাকি উপাদানগুলি বাম দিকে থাকা ব্লকের চারপাশে এবং "ডান" - ডানদিকে প্রবাহিত হবে। যদি আপনি ভাসমান মানটিকে "কোনও নয়" হিসাবে সেট করেন, তবে ব্লক প্রান্তিককরণ সেট করা হবে না। সিএসএসের স্পষ্ট সম্পত্তি ব্লকটিকে ডান, বাম বা উভয় পক্ষের দিকে প্রবাহিত করা থেকে বিরত রাখে এবং ভাসমান বিবৃতিটি ওভাররাইড করে।

প্রস্তাবিত: