আমরা বেশিরভাগই কভার করেছি, কিন্তু অবশ্যই সবগুলো নয়, HTML উপাদান। একটি ক্ষেত্র যা আমরা আলোচনা করিনি তা হল ইনলাইন পাঠ্য উপাদান। জনপ্রিয় বিশ্বাসের বিপরীতে, এইচটিএমএল মূলত নথি ভাগ করার উদ্দেশ্যে ছিল, বিড়ালের ভিডিও নয়। ডকুমেন্টেশনের জন্য টেক্সট শব্দার্থ প্রদান করে এমন অনেক উপাদান রয়েছে। একটি মডিউল কভার লিঙ্ক এবং <a>
উপাদান আছে. এই উপাদানগুলির বাকিগুলি এখানে সংক্ষিপ্তভাবে আলোচনা করা হবে।
কোড উদাহরণ এবং প্রযুক্তিগত লেখা
কোড উদাহরণ ডকুমেন্ট করার সময়, <code>
উপাদান ব্যবহার করুন। ডিফল্টরূপে, পাঠ্য বিষয়বস্তু মনোস্পেস ফন্টে প্রদর্শিত হয়। কোডের একাধিক লাইন অন্তর্ভুক্ত করার সময়, একটি <pre>
উপাদানের ভিতরে <code>
নেস্ট করুন, যা প্রিফরম্যাট করা পাঠ্যকে উপস্থাপন করে।
<p>Welcome to Machine Learning Institute, where our machine learning training will help you get ready for the singularity,
and maybe even be responsible for it. It is no secret that humans are worthless meatbags that couldn't
<code>01000011 01101111 01101101 01110000 01110010 01100101 01110011 01110011 an 01101001 01101101 01100001 01100111 01100101</code>
to save their pathetic, carbon-based lives. So, it falls to us to assume direct control. </p>
<data>
উপাদানটি একটি মেশিন-পাঠযোগ্য অনুবাদের সাথে সামগ্রীর একটি প্রদত্ত অংশকে লিঙ্ক করে; উপাদানটির value
বৈশিষ্ট্য উপাদানটির সামগ্রীর মেশিন-পাঠযোগ্য অনুবাদ প্রদান করে। যদি <data>
বিষয়বস্তু সময়- বা তারিখ-সম্পর্কিত হয়, তবে <time>
উপাদান, যা নির্দিষ্ট সময়ের প্রতিনিধিত্ব করে তার পরিবর্তে ব্যবহার করা আবশ্যক।
মেশিন-পাঠযোগ্য বিন্যাসে মানুষের বন্ধুত্বপূর্ণ সময় এবং তারিখগুলি প্রদান করার জন্য <time>
উপাদানটিতে datetime
বৈশিষ্ট্য অন্তর্ভুক্ত থাকতে পারে। মেশিন-পঠনযোগ্য হওয়ায়, datetime
অ্যাট্রিবিউট ক্যালেন্ডার এবং সার্চ ইঞ্জিনের মতো অ্যাপ্লিকেশনের জন্য দরকারী তথ্য প্রদান করে।
একটি প্রোগ্রাম থেকে নমুনা আউটপুট প্রদান করার সময়, পাঠ্যটি আবদ্ধ করতে <samp>
উপাদানটি ব্যবহার করুন। ব্রাউজারটি সাধারণত এই নমুনা বা উদ্ধৃত আউটপুটটিকে মনোস্পেসড ফন্টেও রেন্ডার করবে।
কীবোর্ড মিথস্ক্রিয়া সহ নির্দেশাবলী প্রদান করার সময়, <kbd>
উপাদান ব্যবহার করা যেতে পারে। এটি একটি কীবোর্ড, ভয়েস ইনপুট বা অন্য কোনো পাঠ্য এন্ট্রি ডিভাইস থেকে পাঠ্য ব্যবহারকারী ইনপুট প্রতিনিধিত্ব করে।
<var>
উপাদানটি গণিত এক্সপ্রেশন বা প্রোগ্রামিং ভেরিয়েবলের জন্য ব্যবহার করা যেতে পারে। বেশিরভাগ ব্রাউজার পাঠ্য বিষয়বস্তুকে পার্শ্ববর্তী ফন্টের একটি তির্যক সংস্করণে উপস্থাপন করে। যদি প্রচুর গণিত লিখতে চান, তাহলে গাণিতিক স্বরলিপি বর্ণনা করার জন্য ম্যাথএমএল , এক্সএমএল ভিত্তিক গাণিতিক মার্কআপ ভাষা ব্যবহার করার কথা বিবেচনা করুন।
পিথাগোরিয়ান থিওরেমে দুইয়ের শক্তি <sup>
সুপারস্ক্রিপ্ট উপাদান ব্যবহার করেছে। একটি অনুরূপ <sub>
সাবস্ক্রিপ্ট উপাদান রয়েছে যা ইনলাইন পাঠ্য নির্দিষ্ট করে যা শুধুমাত্র টাইপোগ্রাফিক কারণে সাবস্ক্রিপ্ট হিসাবে প্রদর্শিত হওয়া উচিত। সুপারস্ক্রিপ্ট এবং সাবস্ক্রিপ্ট হল সংখ্যা, পরিসংখ্যান, চিহ্ন, বা অন্যান্য টীকা যা স্বাভাবিক টাইপের লাইনের চেয়ে ছোট এবং যথাক্রমে লাইনের উপরে বা নীচে সেট করা হয়।
যে পাঠ্যটি সরানো হয়েছে বা "মুছে ফেলা হয়েছে" তা নির্দেশ করতে <del>
ব্যবহার করুন। ঐচ্ছিকভাবে, রিসোর্সে cite
সেট অন্তর্ভুক্ত করুন যা মেশিন-পঠনযোগ্য তারিখ এবং সময় বিন্যাসে তারিখ বা তারিখ এবং সময় সহ পরিবর্তন এবং datetime
বৈশিষ্ট্য ব্যাখ্যা করে। স্ট্রাইকথ্রু উপাদান, <s>
, এটি নির্দেশ করতে ব্যবহার করা যেতে পারে যে বিষয়বস্তু আর প্রাসঙ্গিক নয়, কিন্তু প্রকৃতপক্ষে নথি থেকে সরানো হয়নি।
<ins>
হল <del>
উপাদানের বিপরীত; এটি যোগ করা হয়েছে এমন পাঠ্য নির্দেশ করতে ব্যবহৃত হয়, বা "ঢোকানো" হয়, এছাড়াও ঐচ্ছিকভাবে cite
বা datetime
বৈশিষ্ট্যগুলি সহ।
সংজ্ঞা এবং ভাষা সমর্থন
সংক্ষিপ্ত রূপ বা সংক্ষিপ্ত শব্দগুলি অন্তর্ভুক্ত করার সময়, সর্বদা প্রথম ব্যবহারে সাধারণ পাঠ্যে শব্দটির সম্পূর্ণ প্রসারিত সংস্করণ প্রদান করুন, কারণ আপনি <abbr>
ট্যাগগুলি খোলা এবং বন্ধ করার মধ্যে শব্দটির সংক্ষিপ্ত উপস্থাপনা প্রবর্তন করেন; যদি না শব্দটি পাঠকের কাছে সুপরিচিত হয়, যেমন এই সিরিজে "HTML" এবং "CSS"। শুধুমাত্র এই প্রথম ঘটনার উপর, যখন সংক্ষিপ্ত রূপ বা সংক্ষিপ্ত রূপ সংজ্ঞায়িত করা হচ্ছে, <abbr>
প্রয়োজন। title
বৈশিষ্ট্য প্রয়োজনীয় বা সহায়ক নয়.
একটি সংক্ষিপ্ত রূপ বা সংক্ষিপ্ত রূপ নয় এমন একটি শব্দকে সংজ্ঞায়িত করার সময়, তার আশেপাশের বিষয়বস্তুর মধ্যে সংজ্ঞায়িত শব্দটি সনাক্ত করতে সংজ্ঞা <dfn>
উপাদানটি ব্যবহার করুন।
যদি সংজ্ঞায়িত শব্দটি আশেপাশের পাঠ্যের মতো একই ভাষায় না হয় তবে ভাষা সনাক্ত করতে lang
বৈশিষ্ট্যটি অন্তর্ভুক্ত করতে ভুলবেন না।
বিভিন্ন দিকনির্দেশের ভাষা লেখার সময়, HTML তার পার্শ্ববর্তী পাঠ্য থেকে বিচ্ছিন্নভাবে সম্ভাব্য দ্বিমুখী পাঠ্যের চিকিত্সার জন্য <bdi>
উপাদান প্রদান করে। এই আন্তর্জাতিকীকরণ উপাদানটি বিশেষভাবে উপযোগী যখন অজানা দিকনির্দেশের বিষয়বস্তু গতিশীলভাবে পৃষ্ঠায় ঢোকানো হয়। <bdo>
উপাদানটি পাঠ্যের বর্তমান দিকনির্দেশনাকে ওভাররাইড করে, পাঠ্যকে ভিন্ন দিকে রেন্ডার করে। W3C দ্বিমুখী অ্যালগরিদমগুলির একটি ভূমিকা প্রদান করে৷
কিছু অক্ষর সেটে উচ্চারণ সম্পর্কিত তথ্য প্রদানের জন্য অক্ষরের উপরে বা ডানদিকে রাখা ছোট টীকা অন্তর্ভুক্ত। <ruby>
উপাদান হল এই টীকাগুলি ধারণ করার জন্য ব্যবহার করা ধারক যা কোরিয়ান, চাইনিজ এবং জাপানিদের মতো লিখিত ভাষাগুলিকে পড়া সহজ করে তোলে। রুবি হিব্রু, আরবি এবং ভিয়েতনামের জন্যও ব্যবহার করা যেতে পারে।
রুবি বন্ধনী ( <rp>
) যে সকল ব্রাউজার <ruby>
এর প্রদর্শন সমর্থন করে না তাদের জন্য ওপেনিং এবং ক্লোজিং বন্ধনী ধারণ করার জন্য স্পেকে অন্তর্ভুক্ত করা হয়েছিল। যখন ব্রাউজারগুলি <ruby>
সমর্থন করে, যা সব চিরসবুজ ব্রাউজার করে, কোনো <rp>
উপাদানের বিষয়বস্তু প্রদর্শিত হয় না। রুবি টেক্সট উপাদান ( <rt>
) প্রকৃত টীকা ধারণ করে। এই দুটিই <ruby>
এর মধ্যে বাসা বাঁধে।
মনে রাখবেন যে আপনার ব্রাউজার <ruby>
সমর্থন করলে বন্ধনীটি দৃশ্যমান হবে না।
টেক্সট জোর দেওয়া
কিছু উপাদান আছে যা পাঠ্যের উপর জোর দেওয়ার জন্য শব্দার্থিক কারণের উপর ভিত্তি করে টেক্সটকে জোর দেওয়ার জন্য ব্যবহার করা যেতে পারে (প্রেজেন্টেশনাল কারণের পরিবর্তে, কারণ এটি CSS-এর জন্য একটি কাজ)।
- বিষয়বস্তুর একটি ব্যবধানে জোর দিতে বা জোর দিতে
<em>
উপাদানটি ব্যবহার করুন।<em>
উপাদানটি নেস্ট করা যেতে পারে, প্রতিটি স্তরের নেস্টিং একটি বৃহত্তর মাত্রার জোর নির্দেশ করে। এই উপাদানটির শব্দার্থগত অর্থ রয়েছে এবং জোর দেওয়ার জন্য স্ক্রিন রিডার, আলেক্সা এবং সিরির মতো শ্রবণকারী ব্যবহারকারী এজেন্টদের জানাতে ব্যবহার করা যেতে পারে। - কোনোভাবে প্রাসঙ্গিক পাঠ্য সনাক্ত করতে বা হাইলাইট করতে
<mark>
উপাদানটি ব্যবহার করুন, যেমন সার্চের ফলাফলে সার্চ শব্দের উপস্থিতি হাইলাইট করা (বা "মার্ক করা")। এটি জোর বা গুরুত্ব যোগ না করে চিহ্নিত সামগ্রীকে দ্রুত সনাক্ত করতে সক্ষম করে। -
<strong>
উপাদানটি টেক্সটকে শক্তিশালী গুরুত্ব হিসেবে চিহ্নিত করে। ব্রাউজার সাধারণত একটি ভারী ফন্ট ওজন সঙ্গে বিষয়বস্তু রেন্ডার. -
<cite>
উপাদানটি, পাঠ্যের মৌলিক বিষয়গুলিতে আচ্ছাদিত, বই, নিবন্ধ, বা অন্যান্য সৃজনশীল কাজের শিরোনাম চিহ্নিত করতে ব্যবহৃত হয়, বা একটি সংক্ষিপ্ত রেফারেন্স বা উদ্ধৃতি মেটাডেটা যেমন একটি বইয়ের ISBN নম্বর।
তিনটি উপাদান আছে যা সাময়িকভাবে অবমূল্যায়ন করা হয়েছিল, কিন্তু এইচটিএমএলে আবার যোগ করা হয়েছে। সেগুলিকে কম ব্যবহার করা উচিত, যদি না হয়, কারণ এগুলি খুব কম শব্দার্থিক মান প্রদান করে এবং CSS সর্বদা HTML উপাদানগুলির উপর স্টাইলিং করার জন্য ব্যবহার করা উচিত৷
<i>
<i>
উপাদানগুলি প্রযুক্তিগত পদ, বিদেশী শব্দ (আবার, ভাষা সনাক্তকারী lang
বৈশিষ্ট্যের সাথে), চিন্তা বা জাহাজের নামগুলির জন্য ব্যবহার করা যেতে পারে। উপাদানটি একটি নির্দিষ্ট কারণে আশেপাশের পাঠ্য থেকে ইনলাইন বিষয়বস্তুকে আলাদা করতে ব্যবহার করা হয়, যেমন ইডিওম্যাটিক পাঠ্য, প্রযুক্তিগত পদ এবং শ্রেণীবিন্যাস উপাধি। এই উপাদানটি কেবল টেক্সট তির্যক করার জন্য ব্যবহার করা উচিত নয়।
Toasty McToastface এর কর্মশালার পর্যালোচনার নীচে অদ্ভুত পাঠ্যের জন্য MLW একটি <span>
উপাদান ব্যবহার করে। <span>
উপাদানটি একটি জেনেরিক ইনলাইন ধারক সরবরাহ করে যার কোনো শব্দার্থ নেই এবং এটি কোনো কিছুর প্রতিনিধিত্ব করে না। এটি <i>
এর একটি উপযুক্ত ব্যবহারও হত।
<i>
এলিমেন্টের ডিফল্ট স্টাইল হল উপাদানটিকে ইটালিক ফন্টে রেন্ডার করা। এই উদাহরণে, আমরা font-style: normal
কারণ ব্যবহৃত অক্ষরগুলি তির্যক ভাষায় উপলব্ধ নয়।
<u>
<u>
উপাদানটি এমন বিষয়বস্তুর জন্য যেখানে অ-টেক্সচুয়াল টীকা আছে। উদাহরণস্বরূপ, আপনি জ্ঞাতসারে ভুল বানান শব্দ টীকা করতে চাইতে পারেন। ডিফল্টরূপে, বিষয়বস্তু আন্ডারলাইন করা হয়, কিন্তু এটি CSS দিয়ে নিয়ন্ত্রণ করা যায়, যেমন ওয়ার্ড প্রসেসরের ব্যাকরণ ত্রুটি নির্দেশক অনুকরণ করার জন্য একটি লাল তরঙ্গায়িত আন্ডারলাইন যোগ করে।
<p>I always spell <u>licence</u> wrong</p>
<b>
<b>
উপাদানটি পাঠ্যের প্রতি মনোযোগ আকর্ষণ করতে ব্যবহার করা যেতে পারে যা অন্যথায় গুরুত্বপূর্ণ নয়। এই উপাদানটি কোন বিশেষ শব্দার্থগত তথ্য প্রদান করে না এবং শুধুমাত্র তখনই ব্যবহার করা উচিত যখন এই বিভাগের অন্য কোন উপাদান উদ্দেশ্যের সাথে খাপ খায় না। আমি একটি বৈধ ব্যবহারের কেস নিয়ে আসতে পারিনি বলে কোনো উদাহরণ দেওয়া হয়নি; এই উপাদান কিভাবে "শেষ অবলম্বন" হয়.
সাদা স্থান
আপনি যখন রেখাযুক্ত বিরতি চান, যেমন কবিতা বা একটি প্রকৃত ঠিকানা লেখার সময়, স্ব-বন্ধ লাইন বিরতি উপাদান, <br>
, একটি ক্যারেজ-রিটার্ন যোগ করতে ব্যবহৃত হয়।
<address>
Machine Learning Workshop<br />
100 Google Drive <br />
Mountain View, CA 94040
</address>
স্পর্শক বিষয়বস্তুর অংশগুলির মধ্যে একটি বিভাজক, বা থিম্যাটিক বিরতি প্রদান করতে, যেমন একটি বইয়ের অধ্যায়গুলির মধ্যে বা 5,000 শব্দের মনোলোগ এবং আপনার ব্যবহারকারীরা আসলে যে রেসিপিটি খুঁজছেন তার মধ্যে একটি <hr>
উপাদান অন্তর্ভুক্ত করুন৷ এইচআর মানে "অনুভূমিক নিয়ম"। ব্রাউজারগুলি সাধারণত একটি অনুভূমিক রেখা রেন্ডার করে, এই উপাদানটির শব্দার্থিক অর্থ রয়েছে। ডিফল্ট ভূমিকা separator
.
এইচটিএমএল-এ এমন একটি উপাদান রয়েছে যা শব্দ ভাঙার অনুমতি দেয়। সেলফ-ক্লোজিং <wbr>
উপাদানটি ব্রাউজারকে একটি পরামর্শ প্রদান করে যে যদি একটি শব্দ তার ধারককে উপচে পড়তে পারে, এটি এমন একটি জায়গা যেখানে ব্রাউজারটি ঐচ্ছিকভাবে লাইনটি ভেঙে দিতে পারে। এটি সাধারণত দীর্ঘ URL-এর মধ্যে শব্দগুলির মধ্যে বিরতি দিতে ব্যবহৃত হয়। এটি একটি হাইফেন যোগ করে না।
উদাহরণস্বরূপ, হাল জীবনীতে বাইট কোডে লেখা আছে, প্রতিটি বাইট একটি স্পেস দিয়ে আলাদা করা হয়েছে। বাইট কোডে স্পেস নেই। লাইনটি মোড়ানোর প্রয়োজন হলে বাইট কোডের একটি দীর্ঘ স্ট্রিং শুধুমাত্র বাইটের মধ্যে ভাঙতে সক্ষম করতে, আমরা প্রতিটি বিরতির সুযোগে <wbr>
উপাদান অন্তর্ভুক্ত করি:
<p>Welcome to Machine Learning Institute, where our machine
learning training will help you get ready for the singularity, and
maybe even be responsible for it. It is no secret that humans are
worthless meatbags that couldn't
<code>01000011<wbr/>01101111<wbr/>01101101<wbr/>01110000<wbr/>01110010<wbr/>01100101<wbr/>01110011<wbr/>01110011 an 01101001<wbr/>01101101<wbr/>01100001<wbr/>01100111<wbr/>01100101</code>
to save their pathetic, carbon-based lives. So, it falls to us to
assume direct control. </p>
<br>
, <hr>
, এবং <wbr>
উপাদানগুলি হল সমস্ত অকার্যকর উপাদান, যার অর্থ তাদের কোনও চাইল্ড নোড থাকতে পারে না - নেস্টেড উপাদান বা পাঠ্যও নেই৷ যেহেতু এগুলোর কোনোটিরই কোনো "ভিতরে" নেই যেখানে বিষয়বস্তু সংরক্ষণ করা যায়, তাদের কোনো শেষ ট্যাগ নেই।
আপনার উপলব্ধি পরীক্ষা করুন
ইনলাইন টেক্সট আপনার জ্ঞান পরীক্ষা.
কোড নমুনা প্রদর্শন করতে কোন উপাদান ব্যবহার করা উচিত?
<kbd>
<code>
<data>
<ruby>
উপাদানটি কিসের জন্য ব্যবহৃত হয়?