همونطور که میدونیم و میدونید کم کم مرورگها و طراحان وب به سمت استانداردهای جدید میرن…..یکی از این استانداردها پشتیبانی از css3 هستش.البته هنوز که هنوزه با اینکه مدت زیادی از به روز شدن css نمیگذره , اما من خودم شخصا وبسایت خفن انچنانی ندیدم که کامل با css3 کار شده باشه.
البته از مشکلات و بدبختی هایی که IE6 جلوی پای طراحان هم میذاره نمیشه گذشت. چون از اونجایی که یادم میاد هم IE6 و هم IE7 کلا با css مشکل داشتن و خواهند داشت!!
اگه واقعا به وبگردی علاقه دارید و از طرفی هم با سرعت پایین نت در ایران سر و کله میزنید و…….با تمام وجود خواهش میکنم دست از سر کچل IE6 بردارید.کلا دور خاندان IE رو خط بکشید!!در عوض از مروگرهای Fire fox و opera استفاده کنید که اونوقت واقعا معنی وبگردی و استانداردهای وب۲ و جلوه های بصری رو متوجه میشید!!
این چیزی که امروز میخوام براتون بگم هم توی فایر فاکس نسخه ۳ به بالا و هم اپرا نسخه ۹ به بالا کار میکنه……اما توی IE نه!!
opacity یکی از خصوصیاتی هستش که زمانی پیشنویس css3 بود و هم اکنون برای اکثر مرور گرهای نسل جدید کار میکنه.این خصوصیت باعث شفاف یا نیمه شفاف شدن عناصر صفحه شما میشه……یعنی اینکه برای بعضی قسمتها لازم نیست کلی با فتوشاپ کار کنید تا یه عنصر نیمه شفاف درست کنید….کار از این راحت تر؟؟؟
با یه مثال قضیه رو براتون روشن میکنم…..به تیکه کد زیر یه نیگا بندازید:
در خط ۱۱ از این کد استفاده شده….opacityباعث میشه ۶۰ درصد ماتی برای textblock بوجو بیاد(یعنی ۴۰ درصد شفافیت) من برای border و background متن هم رنگ سفید رو انتخاب کردم که یه هارمونی نصبی ایجاد کنه.
به همین راحتی . به هیچ واحدی هم احتیاج نداره……همه چیز درصدیه.نتیجه کار رو هم میتونید اینجا ببنید:
فکر نکنم چیز پیچیده ای باشه…..زیبایی کار اینجاست که شما میتیونید با زدن چند تا کد j-qury در کنار این خصوصیت و یکمی خلاقیت جلوه های قشنگی با عکس و متن و……درست کنید!!!انشالله بعدا به این موضوع هم میرسیم.
در پایان میتونید سورس کدها و نتیجه نهایی رو از اینجا دانلود کنید:









مرسی از آموزشت پسر، حتما ادامه بده.
ممنون محمد جان