• آموزش CSS : طراحی نمای صفحه در حالت پرینت
    #1
    Note 

    سی اس اس به طراح وب این امکان را میدهد که نمای صفحه را در حالت های مختلف تعیین کنید. بطور مثال طراح میتواند فایل های CSS مختلفی را به صفحه لینک کند ، بطوری که اگر صفحه در مرورگر در حال دیده شدن است، صفحه یک جور و با یکسری رنگ دیده شود و اگر صفحه در حال نمایش در دستگاه های PDA است یکجور دیگر و اگر صفحه در حال print شدن است نیز یکجور دیگر نشان داده شود.

    برای تعیین CSS صفحه در حالت عادی که همان نمایش صفحه در مرورگر است ، بصورت زیر فایل CSS را در فایل HTML خود لینک میکنیم :

    کد php:
    <link href=”styles.css” rel=”stylesheet” type=”text/css” media=”all” /> 

    همانطور که شما در کد بالا تعیین کرده اید، این فایل CSS به ازای تمامی رسانه هایی که صفحه ی شما را ببینند ، لود میشود. اما اگر بخواهید به ازای هر رسانه (مانند مرورگر ، دستگاه های PDA و پرینترها) فایل های استایل متفاوتی استفاده شوند باید از کدهای زیر استفاده کنید

    برای نمایش توسط مرورگر :
    کد php:
    <link href=”styles1.css” rel=”stylesheet” type=”text/css” media=”screen” /> 

    برای نمایش هنگام پرینت کردن صفحه :

    کد php:
    <link href=”styles2.css” rel=”stylesheet” type=”text/css” media=”print” /> 

    برای نمایش صفحه در انواع PDA :

    کد php:
    <link href=”styles3.css” rel=”stylesheet” type=”text/css” media=”handheld” /> 

    شما میتوانید هر۳ خط فوق را زیر هم در بالای هرصفحه ی اچتمل خود بنویسید . مرورگر برای نمایش صفحه از styles1.css استفاده میکند. هنگام چاپ صفحه ، فایل styles2.css روی صفحه اعمال میشود. و هنگام بازکردن صفحه در کامپیوترهای جیبی ، فایل styles3.css صفحه را فرمت میکند.

    کاربرد کوچکی از این موضوع : مثلا شما میتوانید class مربوط به ستون تبلیغات را در فایلهای css پرینت و css کامپیوترهای جیبی ، بصورت Display:none تعریف کنید تا در هنگام پرینت از روی مقالات سایت شما ، تبلیغات دیگه پرینت نشه.

    آخرین ویرایش: 12-02-2013 ساعت 11:42، توسط zare
    پاسخ
    ایجاد موضوع جدید   پاسخ به موضوع  

    موضوعات مرتبط با این موضوع...
    موضوع نویسنده پاسخ بازدید آخرین ارسال
      آموزش نکات تکمیلی برای طراحی وبسایت تجاری sheyda69 0 1,063 06-09-2016 ساعت 16:24
    آخرین ارسال: sheyda69
    Note آموزش استاندارد سازی قالب به سبک W3C (رفع خطاها) Behnam Designer 4 1,853 23-01-2015 ساعت 15:30
    آخرین ارسال: Stack OverFlow
    Note دوره آموزشی طراحی قالب با استفاده از Bootstrap rockstar 5 3,059 23-10-2014 ساعت 17:08
    آخرین ارسال: rockstar
    Note آموزش ساخت سایت shahab 1 726 23-07-2014 ساعت 22:04
    آخرین ارسال: Stack OverFlow
    Note آموزش طراحی قالب وردپرس WWWorker 7 1,745 11-03-2014 ساعت 11:04
    آخرین ارسال: WWWorker
    Note آموزش Canvas در HTML5 C0der 2 871 15-12-2013 ساعت 23:56
    آخرین ارسال: BaNNer LorD
    Note آموزش ajax نگار 1 659 23-11-2013 ساعت 22:00
    آخرین ارسال: maJID maGIC

    کاربرانِ درحال بازدید از این موضوع:   1 مهمان