আপনি যদি কখনও এইচটিএমএল এলিমেন্টগুলির তালিকা দেখে থাকেন তবে আপনি হয়তো "ব্লককোট কি?" জিজ্ঞাসা করতে পারেন ব্লককোট উপাদান হল একটি এইচটিএমএল ট্যাগ জুড়ি যা দীর্ঘ উদ্ধৃতি নির্ধারণ করতে ব্যবহৃত হয়। এখানে W3C HTML5 স্পেসিফিকেশন অনুযায়ী এই উপাদানটির সংজ্ঞা রয়েছে:
ব্লককোট উপাদান এমন একটি বিভাগকে প্রতিনিধিত্ব করে যা অন্য উৎস থেকে উদ্ধৃত হয়।
আপনার ওয়েবপেজগুলিতে ব্লককোট কিভাবে ব্যবহার করবেন
যখন আপনি একটি ওয়েব পৃষ্ঠাতে লেখা লিখছেন এবং সেই পৃষ্ঠার লেআউট তৈরি করছেন, আপনি কখনও কখনও উদ্ধৃতি হিসাবে পাঠ্যবর্গের একটি ব্লকটি কল করতে চান।
এটি অন্য কোথাও একটি উদ্ধৃতি হতে পারে, একটি গ্রাহক প্রশংসাপত্রের মত যে একটি কেস স্টাডি বা প্রকল্প সাফল্যের গল্প সঙ্গে। এটি একটি ডিজাইন চিকিত্সাও হতে পারে যা নিবন্ধ বা বিষয়বস্তু থেকে কিছু গুরুত্বপূর্ণ পাঠ পুনরাবৃত্তি করে। প্রকাশনার সময়ে, এটি কখনও কখনও একটি পুল-উদ্ধৃতি বলা হয়, ওয়েব ডিজাইনে, এটি অর্জনের একটি উপায় (এবং আমরা এই প্রবন্ধে যেভাবে ঢুকছি তা) একটি ব্লককোট বলে।
সুতরাং আসুন দেখি কিভাবে ব্লককোট ট্যাগ ব্যবহার করে দীর্ঘ উদ্ধৃতিগুলি সংজ্ঞায়িত করা যায়, যেমন লুইস ক্যারলের "জববারউক্কি" থেকে এই উদ্ধৃতাংশ:
'টুইস ব্রিলিগ এবং স্লিথেই টোভস
Wabe মধ্যে gyre এবং gimble ছিল:
সমস্ত mimsy borogoves ছিল,
এবং মোম রথ আউটগ্রেব
(লুইস ক্যারল দ্বারা)
ব্লককোট ট্যাগ ব্যবহার করার উদাহরণ
ব্লককোট ট্যাগ একটি সেমিক্ট ট্যাগ যা ব্রাউজার বা ব্যবহারকারীর এজেন্টকে বলে যে বিষয়বস্তুগুলি একটি দীর্ঘ উদ্ধৃতি। যেমন, আপনার ব্লককোট ট্যাগের মধ্যে একটি উদ্ধৃতি না থাকা উচিত নয়। মনে রাখবেন, "উদ্ধৃতি" প্রায়ই প্রকৃত শব্দ হয় যা বাইরের উৎস থেকে (যেমন এই নিবন্ধে লেউইস ক্যারল পাঠ্যাংশ) বলেছে বা পাঠ্য আছে, কিন্তু এটি পুরাতন ধারণাটিও হতে পারে যা আমরা আগেই আবৃত করেছি।
যখন আপনি এটি সম্পর্কে চিন্তা করেন, যে pullquote টেক্সট একটি উদ্ধৃতি চিহ্ন, এটি ঠিক একই প্রবন্ধ থেকে যে কোট নিজেই প্রদর্শিত হবে হতে হবে।
বেশিরভাগ ওয়েব ব্রাউজার ব্লককোটের উভয় পক্ষের কিছু ইন্ডেন্টিং (প্রায় 5 স্পেস) যোগ করে যাতে এটি পার্শ্ববর্তী পাঠ্যের থেকে আলাদা হয়। কিছু অত্যন্ত পুরাতন ব্রাউজার তাত্ক্ষণিকভাবে উদ্ধৃত পাঠ্য উপস্থাপন করতে পারে।
মনে রাখবেন যে এটি হল ব্লককোট উপাদানটির ডিফল্ট স্টাইলিং। CSS এর সাথে, আপনার ব্লককোট কিভাবে প্রদর্শিত হবে তার উপর আপনার মোট নিয়ন্ত্রণ রয়েছে। আপনি ইন্টেন্টকে বাড়িয়ে বা এমনকি সরাতে পারেন, পটভূমির রং যোগ করতে পারেন বা পাঠ্য আকার বৃদ্ধি করতে পারেন কোট থেকে আরও কল করতে। আপনি পৃষ্ঠার একপাশে যে উদ্ধৃতি ভাসতে পারেন এবং এটি চারপাশে অন্য টেক্সট মোড়ানো আছে, মুদ্রিত ম্যাগাজিনে pullquotes জন্য ব্যবহৃত একটি সাধারণ দৃশ্যমান শৈলী যা। আপনি CSS- এর সাথে ব্লককোটের চেহারাটি নিয়ন্ত্রণ করেছেন, আমরা কিছুটা সামান্য একটু আলোচনা করব। এখন, আসুন শুরু করা যাক কীভাবে উদ্ধৃতিটি আপনার এইচটিএমএল মার্কআপে যোগ করা যায়।
আপনার পাঠাতে ব্লককোট ট্যাগ যুক্ত করতে, কেবলমাত্র নিম্নলিখিত ট্যাগ জোড়ার সাথে একটি উদ্ধৃতি পাঠ্য পাঠিয়ে দিন -
উদাহরণ স্বরূপ:
'টুইস ব্রিলিগ এবং স্লিথেই টোভস
Wabe মধ্যে gyre এবং gimble ছিল:
সমস্ত mimsy borogoves ছিল,
এবং মোম রথ আউটগ্রেব
যেমন আপনি দেখতে পারেন, আপনি কেবল উদ্ধৃতির অংশে ব্লককোট ট্যাগের জোড়া যোগ করুন এই উদাহরণে, আমরা কিছু বিরতি ট্যাগ ব্যবহার (
) একক লাইন বিভাজক যোগ করতে যেখানে পাঠ্যের উপযুক্ত ভিতরে। এটি কারণ আমরা একটি কবিতা থেকে টেক্সট পুনর্বিবেচনা করা হয়, যেখানে ঐ নির্দিষ্ট বিরতি গুরুত্বপূর্ণ। যদি আপনি একটি গ্রাহক প্রশংসাপত্র উদ্ধৃতি তৈরি করা হয়, এবং লাইন নির্দিষ্ট অংশ বিরতি প্রয়োজন হবে না, আপনি এই বিরতি ট্যাগ যোগ করতে চান না এবং ব্রাউজার নিজেই পর্দা আকার উপর ভিত্তি করে প্রয়োজন হিসাবে ভেঙ্গে এবং বিরতি করতে অনুমতি দেবে না।
ইনডেন্ট পাঠ্য ব্লককোট ব্যবহার করবেন না
অনেক বছর ধরে, ব্লককোট ট্যাগ ব্যবহার করলে লোকেরা তাদের ওয়েবপৃষ্ঠাতে টেক্সট ইন্ডেন্ট করতে চায়, এমনকি যদি সেই টেক্সটটি একটি পুলকোট নাও হয়। এটি একটি খারাপ অনুশীলন! আপনি ব্লককোটের শব্দার্থকে কেবলমাত্র দর্শনীয় কারণগুলির জন্য ব্যবহার করতে চান না। আপনি যদি আপনার পাঠ্য ইন্ডেন্ট করতে চান, তাহলে আপনি স্টাইল শীটগুলি ব্যবহার করবেন, ব্লককোট ট্যাগগুলির (যদি না, অবশ্যই, আপনি ইন্ডেন্ট করার চেষ্টা করছেন একটি উদ্ধৃতি!)। আপনি একটি ইন্ডেন্ট যোগ করার চেষ্টা করছেন যদি এই কোডটি আপনার ওয়েব পৃষ্ঠার মধ্যে রাখুন চেষ্টা করুন:
এটি এমন লেখা হবে যা ইন্ডেন্ট করা হয়।
পরবর্তী, আপনি যে ক্লাসটি CSS শৈলী সহ লক্ষ্য করবেন
.সেন্টেড {
প্যাডিং: 0 10 পিএক্স;
}
এই অনুচ্ছেদের উভয় পাশে প্যাডিং 10 পিক্সেল যোগ করে।
জনিফার ক্রাইনিনের মূল রচনা 5/8/17 এ জেরেমি গিরিড দ্বারা সম্পাদিত