কম্পিউটার

সিএসএস লোড করার জন্য HTML মিডিয়া অ্যাট্রিবিউট কীভাবে ব্যবহার করবেন

HTML <link media> অ্যাট্রিবিউট ব্যবহার করা হয় কোন ডিভাইসের প্রকারের সম্পদ (সাধারণত একটি CSS ফাইল) জন্য অপ্টিমাইজ করা উচিত তা নির্দিষ্ট করতে। এইভাবে আপনি বিভিন্ন উদ্দেশ্যে বিভিন্ন CSS স্টাইলশীট রাখতে পারেন।

media অ্যাট্রিবিউটের বেশ কয়েকটি মান লাগে, যার মধ্যে সবচেয়ে সাধারণ হল:

  • all :ডিফল্ট, যা সমস্ত মিডিয়া টাইপ ডিভাইসে প্রযোজ্য।
  • screen :কম্পিউটার স্ক্রীন, ট্যাবলেট, স্মার্টফোনের জন্য - যেকোনো স্ক্রীন।
  • print :প্রিন্ট প্রিভিউ মোড, এবং মুদ্রিত পৃষ্ঠাগুলির জন্য।

তাই অনুশীলনে, আপনার কাছে বিভিন্ন CSS স্টাইলশীট থাকতে পারে যা screen-এর জন্য অপ্টিমাইজ করা হয়েছে এবং print যথাক্রমে

যেমনঃ

<head>
  <link rel="stylesheet" type="text/css" href="theme.css">
   <link rel="stylesheet" type="text/css" href="screen.css" media="screen">
  <link rel="stylesheet" type="text/css" href="print.css" media="print">
</head>

উপরের উদাহরণে:

  • প্রথম <link> উপাদান একটি মিডিয়া প্রকার নির্দিষ্ট করে না, যার মানে এটি media="all" ব্যবহার করে ডিফল্টরূপে বৈশিষ্ট্য (যা সমস্ত মিডিয়া প্রকারের ক্ষেত্রে প্রযোজ্য)। এটি দৃশ্যমান নয়, তবে এটি আছে।
  • দ্বিতীয় <link> উপাদান media="screen" ব্যবহার করে বৈশিষ্ট্য, যার মানে এই স্টাইলশীটটি পর্দার জন্য অপ্টিমাইজ করা হয়েছে।
  • তৃতীয় <link> উপাদান media="print" ব্যবহার করে বৈশিষ্ট্য, যার মানে এই স্টাইলশীটটি প্রিন্ট/প্রিভিউয়ের জন্য অপ্টিমাইজ করা হয়েছে।

  1. কিভাবে HTML এ গঠন বৈশিষ্ট্য ব্যবহার করবেন?

  2. কিভাবে HTML এ প্রয়োজনীয় বৈশিষ্ট্য ব্যবহার করবেন?

  3. কিভাবে HTML এ একাধিক অ্যাট্রিবিউট ব্যবহার করবেন?

  4. কিভাবে HTML এ লিস্ট এট্রিবিউট ব্যবহার করবেন?