سبد (0)

تبلیغات

رسانه های مختلف در CSS

انواع رسانه ها (Media Types)

Wiki

Media Typeها به شما اجاره می دهد تا چگونگی نمایش سندها در رسانه های مختلف را مشخص کنید، یک سند می تواند روی کاغذ و یا روی صفحه مونیتور به طور متفاوت نمایش داده شود.

بعضی از خصوصیات CSS ، تنها برای یک رسانه خاص تعریف شده است. برای مثال خصوصیت "voice-family" فقط برای عوامل شفاهی (aural) طراحی شده است. بعضی دیگر از خصوصیات می توانند در انواع رسانه های مختلف استفاده شوند. برای مثال، خصوصیت "font-size" می تواند هم برای صفحه نمایش و هم برای کاغذ پرینت استفاده شود، اما شاید با مقادیر مختلف. برای تنظیم خصوصیت "font-size" یک سند، معمولاً به مقدار بزرگتری روی صفحه نمایش نسبت به کاغد پرینت نیاز است، و همچنین فونت Tahoma روی صفحه نمایش راحت تر خوانده می شود، درحالی که فونت Nazanin برای چاپ روی کاغذ مناسب تر است.


قانون [email protected]

Wiki

این قانون به شما اجازه می دهد تا styleهای مختلفی را برای رسانه ها متفاوت در یک برگه style تعریف کنید.

در مثال زیر، مرورگر روی صفحه نمایش یک فونت Verdana با اندازه 14px را نمایش می دهد. اما اگر صفحه پرینت گرفته شود، آنرا با فونت Times و با اندازه 10px نمایش خواهد داد. توجه داشته باشید که در هر دو رسانه خصوصیت font-weight با مقدار "bold" تنظیم شده است:

<html>
<head>
<style>
@media screen
  {
  p.test {font-family:verdana,sans-serif;font-size:14px;}
  }
@media print
  {
  p.test {font-family:times,serif;font-size:10px;}
  }
@media screen,print
  {
  p.test {font-weight:bold;}
  }
</style>
</head>

<body>
....
</body>
</html>

اگر در حال استفاده از مرورگر firefox یا IE5 و نسخه های بالاتر هستید، صفحه بالا را چاپ کنید، خواهید دید که پاراگراف در رسانه های مختلف با فونت و اندازه های متفاوتی نمایش داده می شود.


Media Typeهای مختلف

Wiki

توجه: نام Media Typeها به حروف بزرگ و کوچک، حساس نیست.

Media Typeتوضیحات
all

برای تمام رسانه های مختلف استفاده می شود

aural

برای رسانه های شفاهی استفاده می شود

braille

برای وسیله های لمسی مخصوص نابینایان استفاده می شود

embossed

برای پرینترهای مخصوص نابینایان استفاده می شود

handheld

برای وسیله های کوچک یا دستی استفاده می شود

print

برای چاپ استفاده می شود

projection

برای پروژه های ارائه ای مانند slideها استفاده می شود

screen

برای صفحه نمایش کامپیوتر استفاده می شود

tty

برای رسانه هایی که از کاراکترهای با عرض ثابت (fixed-pitch) استفاده می کنند کاربرد دارد مانند تله تایپ ها یا دورنگارها و ترمینال ها

tv

برای تلویزیون استفاده می شود

دیدگاه‌ها  

+4 # niloofar mashayekh 1395-09-13 20:00
سلام ممنون بابت این همه زحمت بی چشم داشت.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+3 # amin 1394-08-18 16:34
سلام
ایا قانون Media در تمام مرورگر ها به خوبی اجرا می شود ؟
ایا handheld : Media Type برای تلفن های همراه استفاده می شود ؟
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+4 # مهرداد صلاحی 1394-08-19 10:01
با سلام
Media در CSS3 هست و هر مرورگری که CSS3 رو پشتیبانی کنه، مشکلی با media نداره.
اکثر مرورگرهای امروزی که ساپورت میکنن!
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+3 # amin 1394-08-20 14:05
ایا handheld : Media Type برای تلفن های همراه استفاده می شود ؟
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+4 # مهرداد صلاحی 1394-08-20 20:10
راستش نمی‌دونم!!!
تا حالا به این عبارت برخورد نکردم. تو اینترنت هم سرچ کردم، چیزی پیدا نکردم.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+3 # amin 1394-08-20 21:36
راهی نیست که وب سایت را طوری تنظیم کنیم که یک صفحه را به تلفن همراه نشان دهد
و یک صفحه دیگر را به رایانه ؟
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+3 # مهرداد صلاحی 1394-08-20 23:10
توسط کلاسهای بوت استرپ می‌توان محتوا رو طوری تنظیم کرد که در محیط های نمایشی با رزولوشن متفاوت، مطالب رو بر اساس رزولوشن اون محیط نمایش بده،‌ به طوری که محتوا در هر محیط چه مانیتور و چه صفحه موبایل مرتب و منظم نمایش داده بشه.

حتی میشه توسط کلاسهایی که در بوت استرپ تعریف شده یا حتی تعریف شده توسط ما، متن یا مطلبی در مانیتور نمایش داده بشه، ولی در موبایل نمایش داده نشه. و ...

اگه منظورتون از سؤال قبلی این هست، باید بگم که امکانش هست. ولی نیاز به طراحی و سناریو دقیق داره.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+1 # hamid fa 1394-07-18 16:31
سلام به مدیر دقیق و عالی و فوق العاده
واقعا جا داده از زحمات شما تشکر کنم فوق العاده هستید آفرین
تقریبا من کل سایت شما رو خط به خط خوندم
فقط مشکلات کوچکی که وجود دارند برای مثال در جمله هایی از جمع ((ها)) استفاده می کنید ولی آخر جمله مفرد میشود
منظورم این است که اگه این مشکلات جزیی نباشید خواناایی جملات سایت فوق العاده بالا می رود
برای مثال این جمله را ببینید
(((Media Typeها به شما اجاره می دهد)) جمله با جمع شروع میشود ولی آخرش نوشتید می دهد این غلط جمله ای ها خیلی در سایت موجود البته خیلی مهم نیست فقظ گفتم که شما بدانید
ممنون از سایت عالی و بی نظیرتون
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+4 # شهربانو دوستی 1394-07-20 12:13
با سلام و تشکر از حسن توجه شما
از اینکه تا این حد دقیق مطالب سایت بیاموز را دنبال می کنید بسیار خرسندیم.
به خاطر اشتباهاتی که سهواً صورت گرفته عذر خواهی می کنیم. و تمام تلاشمان را برای رفع این موارد بکار خواهیم گرفت.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+2 # MiladFani 1394-06-09 22:32
من تو یه سایت دیدم از این استفاده شده
s6.picofile.com/file/8209514350/1.png
میخواستم ببینم میتونید راهنمایی کنید برای چیه؟
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+2 # شهربانو دوستی 1394-06-11 14:22
با سلام
می توانید به "آموزش CSS-شناور کردن عنصر " مراجعه کنید. برای این کار از لینک زیر استفاده نمایید.
www.beyamooz.com/css/87-advance/293-%D8%AE%D8%A7%D8%B5%DB%8C%D8%AA-float-%D8%AF%D8%B1-css
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+10 # کرامت 1393-08-04 09:31
خیلی زحمت می کشید واقعا دست شما درد نکنه همه چی عالی هست
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن

آموزش صوتی CSS

بستن
مدرس:
سوال و جواب:

ابزاری که در پیش روی دارید یکی از ابزارهای بسیار کاربردی سایت بیاموز در زمینه آموزش است، این ابزار برای سهولت یادگیری شما کاربران محترم طراحی شده است.

فقط کافی است روی عنوان پاراگراف مورد نظرتان کلیک کنید تا پخش صدا آغاز شود ...!

تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehi مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی پرداخت آنلاین -  بانک ملت معرفی بیاموز در شبکه سه پرداخت آنلاین - بانک اقتصاد نوین پرداخت آنلاین - بانک سامان
 
دوره های آموزشی راه اندازی کسب و کارهای اینترنتی
تبلیغات اینترنتی