1. مهمان گرامی، جهت ارسال پست، دانلود و سایر امکانات ویژه کاربران عضو، ثبت نام کنید.
    بستن اطلاعیه

آموزش css/ظاهر جداول/خاصيت empty-cells

شروع موضوع توسط Amon Amarth ‏16/4/13 در انجمن CSS

  1. کاربر ارزشمند

    تاریخ عضویت:
    ‏7/6/12
    ارسال ها:
    11,734
    تشکر شده:
    26,186
    امتیاز دستاورد:
    113
    جنسیت:
    مرد
    حرفه:
    IT-Handmade leather
    آموزش css/ظاهر جداول/خاصيت empty-cells

    [h=3] خاصيت empty-cells [/h] [TABLE="class: pr, width: 100%"]
    [TR]
    [TD="class: prname"] نام خاصيت
    [/TD]
    [TD="class: prname"] نوع خاصيت
    [/TD]
    [TD="class: prdes"] شرح
    [/TD]
    [/TR]
    [TR]
    [TD="class: prbody"] empty-cells [/TD]
    [TD="class: prbody"] show
    hide [/TD]
    [TD="class: prbody"] مشخص می کند که آيا خانه های خالی جدول و خطوط حاشيه های آنها نمايش داده شود يا خير ، که دو حالت دارد :
    - show : خانه های خالی و خطوط حاشيه آنها نمايش داده می شود .
    - show : خانه های خالی و خطوط حاشيه آنها نمايش داده نمی شود ، که حالت پيش فرض است . [/TD]
    [/TR]
    [/TABLE]
    مثال : در مثال زير چند حالت های مختلف نمايش خانه های خالی را بررسی کرده ايم . در جدول اول خانه های خالی نمايش داده شده و در جدول دوم نمايش داده نشده است . ستون دوم جدول های زير خالی است که با رنگ سبز نمايش داده شده است .
    اشاره : متاسفانه بين مرورگرهای مختلف در نمايش بسياری از تگ ها و خواص HTML و CSS اختلاف وجود دارد و بعضی از آنها از برخی از خواص پشتيبانی درستی نمی کنند . برای مثال می توانيد ، صفحات همين سايت را در 3 مرورگر مطرح Internet Explorer , FireFox و Opera مشاهده کنيد تا به اختلافات پی ببريد .

    [TABLE="class: ex"]
    [TR]
    [TD="class: header, colspan: 2"] Example [/TD]
    [/TR]
    [TR]
    [TD="class: body"] < table style="border: solid 2px blue; width: 400px; border-collapse: separate; empty-cells: show" >
    < tr >
    < td style="border: solid 2px blue" >
    Cell 1
    < /td >
    < td style="border: solid 2px green" >
    < /td >
    < td style="border: solid 2px blue" >
    Cell 2
    < /td >
    < /tr >
    < /table >


    < table style="border: solid 2px blue; width: 400px; border-collapse: separate; empty-cells: hide" >
    < tr >
    < td style="border: solid 2px blue" >
    Cell 1
    < /td >
    < td style="border: solid 2px green" >
    < /td >
    < td style="border: solid 2px blue" >
    Cell 2
    < /td >
    < /tr >
    < /table >
    [/TD]
    [TD="class: header"] کد [/TD]
    [/TR]
    [TR]
    [TD="class: body"] [TABLE="width: 400"]
    [TR]
    [TD] Cell 1 [/TD]
    [TD] [/TD]
    [TD] Cell 2 [/TD]
    [/TR]
    [/TABLE]

    [TABLE="width: 400"]
    [TR]
    [TD] Cell 1 [/TD]
    [TD]
    [/TD]
    [TD] Cell 2 [/TD]
    [/TR]
    [/TABLE]
    [/TD]
    [TD="class: header"] خروجی [/TD]
    [/TR]
    [/TABLE]

    [HR][/HR]

    منبع: developer1
     
    یک شخص از این تشکر کرد.