HTML <style> media অপারেটর

HTML <style> ট্যাগ

অর্থাৎ এবং ব্যবহার

media এই বৈশিষ্ট্যটি কোন নির্দিষ্ট মাধ্যম / ডিভাইসকে শৈলীকে নির্দিষ্ট করতে (অপশান্ত করতে) ব্যবহৃত হয়

এই বৈশিষ্ট্যটি কোন নির্দিষ্ট ডিভাইস (যেমন iPhone) এবং অডিও বা প্রিন্ট মাধ্যমের জন্য শৈলীকে নির্দিষ্ট করতে ব্যবহৃত হয়

সুঝাওয়া:এই বৈশিষ্ট্যটি একাধিক মানকে গ্রহণ করতে পারে

একক

উদাহরণ ১

নির্দিষ্টিকরণ করা শৈলীকে প্রিন্টের জন্য

<style media="print">
h1 {color:#000000;}
p {color:#000000;}
body {background-color:#FFFFFF;}
</style>

আপনার নিজেই প্রয়োগ করুন

উদাহরণ ২

মিডিয়া অ্যাট্রিবিউটের width বৈশিষ্ট্য ব্যবহার করে দুইটি শৈলীকে পৃথক করা যায়:

<style media="screen AND (max-width:500px)" type="text/css">
a {
  background-color: grey;
  color: white;
  padding: 15px;
}
</style>
<style media="screen AND (min-width:500px)" type="text/css">
a {
  color: red;
  font-weight: 400;
}
</style>

আপনার নিজেই প্রয়োগ করুন

মন্তব্য:ব্রাউজার উইন্ডোর প্রস্থ কম ৫০০ পিক্সেল হলে প্রথমটি শৈলীটি ব্যবহার করা হয়, ৫০০ পিক্সেলের উপর প্রস্থ হলে দ্বিতীয়টি শৈলীটি ব্যবহার করা হয়

গ্রামার

<style media="value>

সম্ভাব্য অপারেটর

অপারেটর বর্ণনা
and নির্দিষ্টিকরণ AND অপারেটর
not নির্দিষ্টিকরণ NOT অপারেটর
, নির্দিষ্টিকরণ OR অপারেটর

শৈলীর ব্যবহারের শর্তগুলি খুবই বিস্তারিতভাবে ডিজাইন করা যেতে পারে।প্রথমে স্পষ্ট করা উচিত যে, কোন ডিভাইসের ধরনকে লক্ষ্য করা হচ্ছে।উপরোক্ত টেবিলটি সমস্ত নির্দিষ্ট মানকের সার্থক মানকে সারিতে হয়েছে:

ডিভাইস

ডিভাইস বর্ণনা
all ডিফল্ট
aural আউডিয়াল সিন্থেসাইজার
braille ব্রাইল ফিডব্যাক ডিভাইস
handheld হ্যান্ডহেল্ড ডিভাইস (ছোট স্ক্রিন, সীমিত ব্যান্ডওয়াইড)
projection প্রজেকশন
print প্রিন্ট প্রিভিউ মোড / প্রিন্ট পেজ
screen কম্পিউটার স্ক্রিন
tty স্থির সাপেক্ষ চারকের গ্রিডের ইলেক্ট্রনিক টাইপিং মেশিন এবং এর মতো মাধ্যম
tv টেলিভিশনের ধরনের ডিভাইস (নিম্ন রেজলিউশন, সরবরাহকারী ক্ষমতা সীমিত)

�ুজারার উপযোগী হল ডিভাইসকে গ্রুপ করা।কিছু ডিভাইসের ধরন (যেমন screen এবং print) বিভিন্ন ব্রাউজারের মধ্যে বোঝানো একই ভাবে হতে পারে, কিন্তু অন্যান্য ডিভাইস (যেমন handheld) বোঝানো অন্যভাবে হতে পারে।তাই, যে ব্রাউজারকে লক্ষ্য করা হচ্ছে, তার সম্পর্কিত ডিভাইসকে বোঝানো কিভাবকে আমাদের সঙ্গে একই থাকে তা নিশ্চিত করা খুবই জরুরী।

বৈশিষ্ট্য

বৈশিষ্ট্য বর্ণনা
width

লক্ষ্য প্রদর্শক অঞ্চলের প্রস্থ নির্ধারণ করে。

মিন- এবং ম্যাক্স- প্রিফিক্স ব্যবহার করা যেতে পারে。

যেমন: media="screen and (min-width:500px)"
height

লক্ষ্য প্রদর্শক অঞ্চলের উচ্চতা নির্ধারণ করে。

মিন- এবং ম্যাক্স- প্রিফিক্স ব্যবহার করা যেতে পারে。

যেমন: media="screen and (max-height:700px)"
device-width

লক্ষ্য প্রদর্শক/কাগজের প্রস্থ নির্ধারণ করে。

মিন- এবং ম্যাক্স- প্রিফিক্স ব্যবহার করা যেতে পারে。

যেমন: media="screen and (device-width:500px)"
device-height

লক্ষ্য প্রদর্শক/কাগজের উচ্চতা নির্ধারণ করে。

মিন- এবং ম্যাক্স- প্রিফিক্স ব্যবহার করা যেতে পারে。

যেমন: media="screen and (device-height:500px)"
orientation

লক্ষ্য প্রদর্শক/কাগজের দিক নির্ধারণ করে。

সমর্থিত মানগুলো: portrait বা landscape。

এই বৈশিষ্ট্যটিতে কোনও শব্দকোষ নেই

যেমন: media="all and (orientation: landscape)"
aspect-ratio

লক্ষ্য প্রদর্শক অঞ্চলের প্রস্থ/উচ্চতা অনুপাত নির্ধারণ করে。

মিন- এবং ম্যাক্স- প্রিফিক্স ব্যবহার করা যেতে পারে。

যেমন: media="screen and (aspect-ratio:16/9)"
device-aspect-ratio

লক্ষ্য প্রদর্শক/কাগজের ডিভাইস প্রস্থ/ডিভাইস উচ্চতা অনুপাত নির্ধারণ করে。

মিন- এবং ম্যাক্স- প্রিফিক্স ব্যবহার করা যেতে পারে。

যেমন: media="screen and (aspect-ratio:16/9)"
color

লক্ষ্য প্রদর্শকের প্রত্যেক রঙের বিট সংখ্যা নির্ধারণ করে。

মিন- এবং ম্যাক্স- প্রিফিক্স ব্যবহার করা যেতে পারে。

যেমন: media="screen and (color:3)"
color-index

লক্ষ্য প্রদর্শকটি কতটা রঙ প্রক্রিয়াকরণ করতে পারে তা নির্ধারণ করে。

মিন- এবং ম্যাক্স- প্রিফিক্স ব্যবহার করা যেতে পারে。

যেমন: media="screen and (min-color-index:256)"
monochrome

একক রঙের ফ্রেম বাফারে প্রতি পিক্সেলের বিট সংখ্যা নির্ধারণ করে。

মিন- এবং ম্যাক্স- প্রিফিক্স ব্যবহার করা যেতে পারে。

যেমন: media="screen and (monochrome:2)"
resolution

লক্ষ্য প্রদর্শক/কাগজের পিক্সেল ঘনত্ব (dpi বা dpcm) নির্ধারণ করে。

মিন- এবং ম্যাক্স- প্রিফিক্স ব্যবহার করা যেতে পারে。

যেমন: media="print and (resolution:300dpi)"
scan

টেলিভিশনের স্ক্যানিং মোডকে নির্ধারণ করে。

সমর্থিত মানগুলো হল progressive এবং interlace。

এই বৈশিষ্ট্যটিতে কোনও শব্দকোষ নেই

যেমন: media="tv and (scan:interlace)"
গ্রিড

নির্দিষ্ট আউটপুট ডিভাইসটি গ্রিড কিংবা বিটম্যাপ হবে

গ্রিড এক্সপোজার ব্যবহারকারী ডিভাইস বিষয়গত গ্রিডে কনটেন্ট প্রদর্শন করে, যেমন অক্ষর ভিত্তিক টার্মিনাল এবং একলীন প্রদর্শন করা হয়না টেলিকন

সমর্থিত মান 0 এবং 1 (1 হল গ্রিড এক্সপোজার)

এই বৈশিষ্ট্যটিতে কোনও শব্দকোষ নেই

উদাহরণস্বরূপ: media="handheld and (grid:1)"

width এবং অন্যান্য বৈশিষ্ট্যগুলির সাথে min এবং max শব্দকোষ ব্যবহার করা হয়

উপরোক্ত সারিতে উপলব্ধ বিভিন্ন বৈশিষ্ট্যগুলি তালিকাভুক্ত এবং বর্ণিত হয়েছে।ব্যাপকভাবে, এই বৈশিষ্ট্যগুলির মধ্যে min- এবং max- প্রয়োগ করা যায়, যা মানসম্পন্ন মানদণ্ড বা সংকীর্ণ মানদণ্ড হিসাবে গণ্য করা হয়

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

ব্রাউজার সমর্থন

চ্রোম এডজ ফায়ারফক্স স্যাফারি ওপেরা
চ্রোম এডজ ফায়ারফক্স স্যাফারি ওপেরা
সমর্থন সমর্থন সমর্থন সমর্থন সমর্থন

HTML <style> ট্যাগ