এইচটিএমএল বৈশিষ্ট্যগুলির জন্য একটি ধাপে ধাপে নির্দেশিকা৷

HTML বৈশিষ্ট্যগুলি HTML উপাদানগুলির জন্য অতিরিক্ত বৈশিষ্ট্যগুলিকে সংজ্ঞায়িত করে৷ এগুলি একটি HTML উপাদানের খোলার ট্যাগে নির্দিষ্ট করা হয়, এবং কিছু উপাদানের ফাংশনের জন্য একটি বৈশিষ্ট্যের প্রয়োজন হয়৷

এইচটিএমএল বৈশিষ্ট্য কি, এবং আপনি কিভাবে তাদের ব্যবহার করবেন? আপনি যখন HTML শিখছেন, তখন আপনি attributes শব্দটির সম্মুখীন হতে পারেন . একটি HTML পৃষ্ঠায় একটি নির্দিষ্ট উপাদান সম্পর্কে অতিরিক্ত তথ্য প্রদান করতে বৈশিষ্ট্যগুলি ব্যবহার করা হয়৷

বৈশিষ্ট্যগুলি একটি HTML নথির খোলার ট্যাগে নির্দিষ্ট করা হয় এবং সাধারণত একটি নাম/মান জোড়ায় নির্দিষ্ট করা হয়। উদাহরণস্বরূপ, name নামে একটি বৈশিষ্ট্য value মান সহ এই মত প্রদর্শিত হবে:name=value .

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

HTML বৈশিষ্ট্য কি?

এইচটিএমএল মার্কআপ ভাষার প্রতিটি উপাদানের একটি বৈশিষ্ট্য থাকতে পারে, যা সেই উপাদানটির দ্বারা ধারণ করা একটি অতিরিক্ত সম্পত্তি সংজ্ঞায়িত করতে ব্যবহৃত হয়৷

উদাহরণস্বরূপ, আমরা একটি বৈশিষ্ট্য নির্দিষ্ট করতে চাই যা একটি চিত্রের উচ্চতা বা একটি ফর্ম উপাদান দ্বারা সংরক্ষিত মান নির্ধারণ করে। এই বৈশিষ্ট্যগুলি উপাদানগুলির জন্য নির্দিষ্ট, যার মানে হল যে কোনও নির্দিষ্ট উপাদান কীভাবে একটি ওয়েব পৃষ্ঠায় কাজ করে তা কাস্টমাইজ করতে ব্যবহার করা যেতে পারে৷

কিছু ক্ষেত্রে, একটি উপাদানের জন্য গুণাবলী প্রয়োজন। উদাহরণস্বরূপ, আপনি যদি একটি <a> নিয়ে কাজ করেন HTML ট্যাগ, আপনাকে একটি href সংজ্ঞায়িত করতে হবে অ্যাট্রিবিউট যাতে ট্যাগটি জানতে পারে যে ক্লিক করার সময় কোন URL এর দিকে নির্দেশ করা উচিত।

HTML এ একটি বৈশিষ্ট্যের দুটি উপাদান রয়েছে:

81% অংশগ্রহণকারী বলেছেন যে তারা বুটক্যাম্পে যোগ দেওয়ার পরে তাদের প্রযুক্তিগত কাজের সম্ভাবনা সম্পর্কে আরও আত্মবিশ্বাসী বোধ করেছেন। আজই একটি বুটক্যাম্পের সাথে মিলিত হন৷

গড় বুটক্যাম্প গ্র্যাড একটি বুটক্যাম্প শুরু করা থেকে শুরু করে তাদের প্রথম চাকরি খোঁজা পর্যন্ত ক্যারিয়ারের পরিবর্তনে ছয় মাসেরও কম সময় ব্যয় করেছে।

• নাম আপনি যে বৈশিষ্ট্যটি তৈরি করছেন তার নাম নির্ধারণ করে।
• মান বৈশিষ্ট্য দ্বারা ধারণ করা মান সংজ্ঞায়িত করে।

ধরুন আমরা একটি লিঙ্ক সংজ্ঞায়িত করতে চেয়েছিলাম যা ক্যারিয়ার কর্ম ওয়েবসাইটের হোম পেজে নির্দেশ করে। এটি করতে, আমরা একটি <a> ব্যবহার করতে পারি HTML এ ট্যাগ করুন। যাইহোক, যদি আমরা ট্যাগটি ক্যারিয়ার কর্মের হোমপেজে লিঙ্ক করতে চাই, তাহলে আমাদের একটি href ব্যবহার করতে হবে বৈশিষ্ট্য।

এখানে একটি <a> এর একটি উদাহরণ ট্যাগ যা ক্যারিয়ার কর্ম হোমপেজে লিঙ্ক করে:

<a href="https://careerkarma.com/">Career Karma</a>

এই ট্যাগটি href নামে একটি বৈশিষ্ট্য ব্যবহার করে এবং এটিকে "https://careerkarma.com/" মান নির্ধারণ করে, যা ক্যারিয়ার কর্মের হোমপেজের URL।

HTML-এর বৈশিষ্ট্যগুলি অক্ষর সংবেদনশীল, তবে বৈশিষ্ট্যগুলি সাধারণত ছোট হাতের অক্ষরে লেখা হয়

একক এবং দ্বৈত উদ্ধৃতি HTML

আপনি যখন কোনো অ্যাট্রিবিউটে একটি মান নির্ধারণ করছেন, আপনি একক এবং ডবল উদ্ধৃতি উভয়ই ব্যবহার করতে পারেন। ডবল উদ্ধৃতি ব্যবহার করা হল সবচেয়ে সাধারণ পদ্ধতি (এবং এটি আমরা আগে আমাদের উদাহরণে ব্যবহার করেছি)। যাইহোক, আপনি যে পদ্ধতি ব্যবহার করেন তা আপনার বৈশিষ্ট্যের বিষয়বস্তুর উপর নির্ভর করে।

ধরুন আমরা একটি ফর্ম উপাদান তৈরি করছি যার মান আছে John ‘Rocketman’ Smith . এই ক্ষেত্রে, যেহেতু আমাদের মান একক উদ্ধৃতি ধারণ করে, আমাদের বৈশিষ্ট্যের নামের জন্য আমাদের ডবল উদ্ধৃতি ব্যবহার করা উচিত। এই বৈশিষ্ট্যটি ঘোষণা করতে আমরা যে কোডটি ব্যবহার করব তা এখানে:

<input type="text" value="John 'Rocketman' Smith">

অন্যদিকে, ধরুন আমাদের মানটিতে দ্বিগুণ উদ্ধৃতি রয়েছে এবং তার পরিবর্তে ছিল John “Rocketman” Smith . এই ক্ষেত্রে, আমরা আমাদের বৈশিষ্ট্য সংজ্ঞায়িত করতে একক উদ্ধৃতি ব্যবহার করতে চাই। আমরা যে কোডটি ব্যবহার করব তা এখানে:

<input type="text" value='John "Rocketman" Smith'>

এইচটিএমএল বুলিয়ান অ্যাট্রিবিউট কীভাবে ব্যবহার করবেন

কিছু বৈশিষ্ট্য নাম/মান জোড়া গঠন ব্যবহার করে না। আমরা এইগুলিকে বুলিয়ান বৈশিষ্ট্য হিসাবে উল্লেখ করি। এই বৈশিষ্ট্যগুলির শুধুমাত্র একটি সত্য-মিথ্যা মান থাকতে পারে এবং তাদের মান সত্য হিসাবে সেট করা হয় যদি সেগুলি নির্দিষ্ট করা হয় এবং যদি সেগুলি নির্দিষ্ট না করা হয় তবে মিথ্যা৷

বুলিয়ান অ্যাট্রিবিউটগুলি সাধারণত HTML ফর্মগুলিতে ব্যবহৃত হয়। ধরুন আমরা একটি ফর্ম ফিল্ড তৈরি করছি যা একজন ব্যবহারকারীকে তাদের নাম জিজ্ঞাসা করে। আমরা এই ফর্ম ক্ষেত্রটি ডিফল্টরূপে বাধ্যতামূলক হতে চাই। আমরা required ব্যবহার করতে পারি এই কাজটি সম্পন্ন করতে বুলিয়ান অ্যাট্রিবিউট:

<input type="text" value="Name" required>

এই উদাহরণে, আমরা একটি ইনপুট ট্যাগ সংজ্ঞায়িত করেছি যার তিনটি বৈশিষ্ট্য রয়েছে। প্রথম দুটি বৈশিষ্ট্য, type এবং value , নাম/মান কাঠামো ব্যবহার করুন। তৃতীয় বৈশিষ্ট্য, required , একটি বুলিয়ান বৈশিষ্ট্য। কারণ আমরা required নির্দিষ্ট করেছি বুলিয়ান অ্যাট্রিবিউট, এর মান সত্য হিসাবে সেট করা হয়েছে।

স্ট্যান্ডার্ড HTML বৈশিষ্ট্যগুলি কীভাবে ব্যবহার করবেন

কিছু HTML বৈশিষ্ট্য রয়েছে যা HTML-এর প্রতিটি উপাদানের জন্য প্রযোজ্য। এগুলোকে বলা হয় গ্লোবাল অ্যাট্রিবিউট।

আপনি সম্ভবত একটি ওয়েবপৃষ্ঠা জুড়ে এইগুলির মুখোমুখি হতে পারেন, তাই এটি গুরুত্বপূর্ণ যে আপনি জানেন যে সেগুলি কী এবং তারা কীভাবে কাজ করে৷ আসুন এলিমেন্টে প্রয়োগ করা সবচেয়ে সাধারণ স্ট্যান্ডার্ড এইচটিএমএল অ্যাট্রিবিউটের চারটি মাধ্যমে চলুন।

এইচটিএমএল আইডি অ্যাট্রিবিউট

আইডি অ্যাট্রিবিউট একটি উপাদানকে একটি অনন্য শনাক্তকারী দেয়। আইডি অ্যাট্রিবিউট নিজেই একটি এইচটিএমএল উপাদান কীভাবে উপস্থিত হয় তা প্রভাবিত করে না, তবে আপনি যখন CSS বা জাভাস্ক্রিপ্টের সাথে কাজ করছেন তখন এটি আপনাকে ম্যানিপুলেট করার জন্য একটি নির্দিষ্ট উপাদান নির্বাচন করার অনুমতি দেয়৷

আপনি যে আইডি বরাদ্দ করেন কোনো প্রদত্ত উপাদান একটি নথিতে অনন্য হওয়া উচিত।

<p>-এ ব্যবহৃত আইডি অ্যাট্রিবিউটের উদাহরণ এখানে দেওয়া হল ট্যাগ:

<p id="secondParagraph">Hello, there! Welcome to my site.</p>

এই উদাহরণে, আমরা আমাদের <p> বরাদ্দ করেছি secondParagraph মান সহ একটি আইডি বৈশিষ্ট্য ট্যাগ করুন .

HTML শিরোনাম বৈশিষ্ট্য

HTML শিরোনাম বৈশিষ্ট্য প্রায়ই একটি উপাদান বা তার বিষয়বস্তু ব্যাখ্যা করতে ব্যবহার করা হয়. একটি শিরোনাম বৈশিষ্ট্যের মধ্যে সংরক্ষিত মান একটি টুলটিপ হিসাবে প্রদর্শিত হয় যা প্রদর্শিত হয় যখন কোনও ব্যবহারকারী তাদের কার্সার দিয়ে উপাদানটির উপর ঘোরায়৷

ধরুন আমাদের একটি ইনপুট ক্ষেত্র রয়েছে যা ব্যবহারকারীর নাম সংগ্রহ করে। আমরা This field is required দেখাতে চাই যখন ব্যবহারকারী মাঠের উপর ঘোরাফেরা করে। আমরা নিম্নলিখিত কোড ব্যবহার করে এই লক্ষ্যটি অর্জন করতে পারি:

<input type="text" title="This field is required">

যখন আমরা টেক্সট ফিল্ডের উপর হভার করি, নিম্নলিখিত টুলটিপটি উপস্থিত হয়:

HTML শৈলী বৈশিষ্ট্য

HTML শৈলী বৈশিষ্ট্য একটি নির্দিষ্ট উপাদানের জন্য CSS শৈলী নির্দিষ্ট করতে ব্যবহৃত হয়। একটি উপাদান স্টাইল করার এই পদ্ধতিটিকে একটি ইনলাইন শৈলী তৈরি হিসাবে উল্লেখ করা হয়।

ধরুন আমরা পাঠ্যের একটি অনুচ্ছেদ তৈরি করছি যা আমরা ধূসর রঙে দেখাতে চাই। আমরা আমাদের পাঠ্যের রঙ নির্দিষ্ট করতে শৈলী বৈশিষ্ট্য ব্যবহার করতে পারি। এই কাজটি সম্পন্ন করতে আমরা যে কোডটি ব্যবহার করতে পারি তা এখানে:

<p style="color: gray;">Hello, there! This is my website.</p>

এখানে আমাদের কোডের আউটপুট:

আপনি দেখতে পাচ্ছেন, আমাদের পাঠ্যের রঙ ধূসর হয়ে গেছে। এটি কারণ আমরা একটি শৈলী বৈশিষ্ট্য নির্দিষ্ট করেছি এবং color পরিবর্তন করেছি শৈলী gray এর সমান হতে হবে .

উপাদান-নির্দিষ্ট HTML গুণাবলী

অন্যান্য বৈশিষ্ট্যের বিস্তৃত পরিসর রয়েছে যা আপনি সম্মুখীন হতে পারেন যা একটি উপাদানের জন্য নির্দিষ্ট। এখানে কয়েকটি উদাহরণ রয়েছে:

img src

<img src="source.png">

এই উদাহরণে, আমরা src বৈশিষ্ট্য নির্দিষ্ট করেছি। এই বৈশিষ্ট্যটি img এর সাথে ব্যবহার করা হয় ট্যাগ ফাইলের দিকে নির্দেশ করতে ট্যাগটি ওয়েবপেজে রেন্ডার করা উচিত।

a href

<a href="https://careerkarma.com/">Career Karma homepage</a>

href <a> বলতে এই উদাহরণে অ্যাট্রিবিউট ব্যবহার করা হয়েছে লিঙ্কটি ক্লিক করার সময় ব্যবহারকারীকে কোন সাইটের দিকে নির্দেশ দিতে হবে তা ট্যাগ করুন।

img alt

<img src="source.png" alt="Image of a book">

আমাদের কোডে, আমরা alt উল্লেখ করেছি বৈশিষ্ট্য এই অ্যাট্রিবিউটটি img ট্যাগের জন্য নির্দিষ্ট এবং বিকল্প টেক্সট নির্দিষ্ট করে যা ওয়েবপেজ দ্বারা প্রসেস করা হয় যদি কোনো ছবি প্রদর্শন করা না যায়।

HTML-এর Alt অ্যাট্রিবিউটটি স্ক্রিন রিডারদের দ্বারা পড়তে পারে, তাই স্ক্রীন রিডারের উপর নির্ভরশীল দৃষ্টি প্রতিবন্ধী কেউ আমাদের ওয়েবপৃষ্ঠাটি বুঝতে পারে৷

এইচটিএমএল বৈশিষ্ট্যগুলি কীভাবে ব্যবহার করবেন:উপসংহার

অ্যাট্রিবিউট হল অতিরিক্ত বৈশিষ্ট্য যা HTML-এর একটি নির্দিষ্ট উপাদানে প্রয়োগ করা হয়। বৈশিষ্ট্যগুলি সর্বদা একটি উপাদানের খোলার ট্যাগে নির্দিষ্ট করা হয় এবং সাধারণত নাম/মান জোড়া ব্যবহার করে৷

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