کتاب 101 نکته و ترفند برای استفاده از CSS در طراحی وب

  • چهارشنبه ۵ دی ۱۳۹۷
  • بازدید ۱,۶۴۰ نفر

تصویر tip-and-trick-to-using-css-in-web-design-book_5286 کتاب 101 نکته و ترفند برای استفاده از CSS در طراحی وب

موجود است

کتاب 101 نکته و ترفند برای استفاده از CSS در طراحی وب

نویسنده:ریچل اندرو

مترجم:امیر عباس عبدالعلی

ناشر:ناقوس

سال انتشار:۱۳۹۷

نوبت چاپ:پنجم

تعداد صفحات:۳۶۰

شابک:۹۷۸-۹۶۴-۹۴۷۸۳-۸-۲

زبان:فارسی

۴۲,۰۰۰ تـــــومان

توضیحات

شما در این كتاب اصول كلی CSS را نمی آموزید. چیزی كه شما در این كتاب خواهید یافت، راه حل هایی است كه به شما كمک می كند تا با استفاده از CSS یک طراحی متعارف و امروزی را ایجاد كنید. به تجربه دریافته ام كه همیشه آموختن همراه با انجام كار به طور عملی نسبت به خواندن مطلب و حفظ كردن آن بسیار مؤثرتر است. از این كتاب استفاده كنید تا بتوانید ترفند های جدید را بیاموزید و با استفاده از آنها بتوانید سایت مشتریان خود را در كمترین زمان ممكن تحویل دهید. از شما خواهش دارم كه تمرینات كتاب را هم انجام دهید و سعی كنید با استفاده از این تمرین ها، جلوه های جدیدتری را خلق كنید. مطالب كتاب به گونه ای تنظیم شده كه به شما اجازه می دهد به سرعت پاسخ بعضی از مشکلات رایج در CSS را بیابید احتیاجی نیست که کتاب را از اول به آخر و به طور كامل مطالعه كنید؛ فقط كافیست ترفند های مورد نیاز و یا ترفند هایی را كه برای شما جالب بوده از كتاب برداشت كنید و از آنها استفاده كنید. همراه با هر راه حل، من توضیحی را هم درباره ترفند مورد نظر دادم تا شما متوجه شوید كه ترفند مربوطه به چه شكل كار می كند. این اطلاعات به شما كمک می كند تا اطلاعات خود را افزایش دهید.

فهرست مطالب کتاب

فصل اول – شروع کار با CSS

  • مشكلات در استفاده از زبان HTML
  • تعریف سبكها با استفاده از CSS
  • گزینشگر های CSS

فصل دوم – سبک دهی به متن و سایر مسائل مقدماتی

  • چگونه دستورات FONT را با CSS جایگزین کنیم؟
  • باید از کدام یک از واحد های pixel ، point  ، ems استفاده کنم ؟ آیا به واحد دیگری جز این موارد هم نیاز است؟
  • چگونه تعیین كنم كه متن مورد نظر من با فونت معینی نمایش داده شود؟
  • چگونه خطوط زیرین لینک ها را حذف كنم؟
  • چگونه لینكی ایجاد كنم كه در زمانی كه نشانگر ماوس بر روی آن قرار می گیرد، تغییر رنگ بدهد؟
  • چگونه لینک هایی با دو سبک متفاوت را در یک صفحه نمایش دهم؟
  • چگونه به بخش عنوان، رنگ پس ز مینه اضافه كنم؟
  • چگونه به عناوین، خط زیرین اضافه كنم؟
  • چگونه از دست فاصله زیاد بین عناوین ایجاد شده توسط دستور <h1> و پاراگرافی که بعد آن میاید خلاص شوم
  • چگونه بدون استفاده از برچسب های font يک متن را در صفحه با فونت ضخيم نمايش دهم؟
  • چگونه با استفاده از خصوصيت line – height فاصله بين خطوط متن را تغيير دهم؟
  • چگونه متن را در صفحه تراز كنم؟
  • چگونه يک خط افقی را در صفحه سبک دهی كنم؟
  • چگونه متن را از كناره صفحه فاصله دهم؟
  • چگونه متن را در ميانه صفحه متمركز كنم؟
  • چگونه تمامی حروف يک عبارت متنی را به وسيله CSS با حروف بزرگ نمایش دهم؟
  • چگونه نشانه های كوچكی را كه به فرم مربع يا دايره در فهرست ها به كار گرفته می شود حذف كنم و يا تغيير دهم؟
  • چگونه يک تصوير را به جای نشانه های مربع يا دايره مربوط به فهرست قرار دهم؟
  • چگونه فاصله هایی را كه ميان يک فهرست و لبه سمت چپ سند ديده می شود حذف كنم؟
  • چگونه يک فهرست را به شكل افقی نمايش دهم؟
  • چگونه به یک فایل CSS توضیحاتی را اضافه کنیم؟
  • چگونه از دست فاصله هايی كه در اطراف سند ظاهر می شود خلاص شوم ؟ البته بدون دستكاری برچسب <body>

فصل سوم – CSS و تصاویر

  • چگونه می توانم به يک تصوير، خط مرزی (خط دور) اضافه كنم؟
  • چگونه خط مرزی را که HTML به طور پيش فرض به تصاوير لينک ميدهد با خصوصيات CSS جایگزین کنم؟
  • چگونه می توانم با استفاده از CSS یک تصویر را پس زمینه صفحه خود قرار دهم؟
  • چگونه می توانم محل قرارگيری تصوير پس زمينه را تعيين كنم؟
  • چگونه می توانم تصوير را در پس زمينه قرار دهم به طوری كه وقتی صفحه پيمايش می شود تصوير ثابت بماند و فقط عناصر پيش زمينه scroll شوند؟
  • چگونه می توانم برای عناصر ديگر صفحه، تصوير پس زمينه تعيين كنم؟
  • چگونه می توانم بر روی تصوير پس زمينه متن قرار دهم؟
  • چگونه می توانم بيش از يک تصوير را در پس زمينه صفحه قرار دهم؟

فصل چهارم – ایجاد بخش ناوبری سایت با استفاده از CSS

  • چگونه بخش ناوبری مبتنی بر تصاوير را با CSS جایگزین کنم؟
  • چگونه يک فهرست ساخت يافته را سبک دهی كنم و از آن به عنوان يک بخش ناوبری استفاده كنم؟
  • چگونه از CSS برای ايجاد و سبک دهی بخش ناوبری پويا استفاده كنم؟
  • آيا من می توانم با استفاده از CSS يک بخش ناوبری ايجاد كنم كه دارای زير مجموعه نيز باشد؟
  • چگونه به كمک فهرست ها و CSS یک فهرست افقی ایجاد کنیم؟
  • چگونه به اجزای درون فهرست كه شبيه به دكمه های ساده سبک دهی شده اند، جلوه سه بعدی بدهم؟
  • چگونه بخش ناوبری را به شكل سربرگ و به كمک CSS بسازیم؟
  • چگونه شكل مكان نمای ماوس را تغيير دهم؟
  • چگونه جلوه rollover را بدون Javascript و تنها با استفاده از CSS ایجاد کنم؟

فصل پنجم – داده های جدولی

  • چگونه می توانم جدول صفحه گسترده خود را با استفاده از CSS طراحی کنم؟
  • چگونه يقين داشته باشم كه اطلاعات جدولی من به شكل مطلوب نمايش داده خواهد شد؟
  • چگونه می توانم بدون استفاده از ويژگی های HTML به یک جدول خط مرزی اضافه کنم؟
  • چگونه می توانم فاصله بين خطوط مرزی خانه های جدول را حذف كنم؟
  • چگونه می توانم داده های صفحه گسترده خود را در يک جدول قرار دهم به طوری كه هم جذاب بوده و هم قابل استفاده باشد؟
  • چگونه می توانم سطر های جدول را با رنگهای تناوبی نمايش دهم؟
  • چگونه می توانم كاری كنم كه با قرار گرفتن ماوس بر روی سطر های جدول، رنگ پس زمينه آن سطر تغيير كند؟
  • چگونه می توانم يک تقويم را با استفاده از CSS ایجاد کنم؟

فصل ششم – فرم ها و واسط های كاربری

  • چگونه می توانم عناصر مربوط به فرم را با استفاده از CSS سبک دهی کنم؟
  • چگونه می توانم سبک های متفاوتی را به فيلد های مختلف يک فرم اختصاص دهم؟
  • چگونه می توانم از اضافه شدن فضای سفيد به اطراف فرم جلوگيری كنم و چطور فرم را در وسط يک خط قرار دهم؟
  • چگونه يک دكمه تاييد ايجاد كنم كه شبيه به دكمه های متنی باشد؟
  • چگونه اطمينان داشته باشم كه آن دسته از كاربران كه از مرورگر های متنی استفاده می كنند، قادر به درک فرمها و پركردن آنها خواهند بود؟
  • چگونه می توانم به جای استفاده از برچسب <tabel> يک فرم با طرح دو ستونی را با استفاده از CSS ایجاد کنم؟
  • چگونه می توانم چند فيلد مرتبط با هم را به شكل گروه در آورم؟
  • چگونه با استفاده از CSS در صفحات وب، كليد های دسترسی را ايجاد و سبک دهی كنم؟
  • چگونه يک ليست پايين افتادنی ایجاد کنم كه هر گزينه داخل ليست با رنگ متفاوتی نمايش يابد؟
  • من در طرح خود فرمی دارم كه به كاربران اجازه می دهد، اطلاعاتی را در آن وارد كنند و محيط اين فرم، كاملاً شبيه محيط برنامه های صفحه گسترده است. چگونه می توانم اين فرم را با استفاده از CSS سبک دهی کنم؟
  • چگونه فيلد های داخل فرم را سبک دهی كنم تا وقتی كه كاربر بر روی فيلد ها كليک كرد، نمای فيلد انتخاب شده از بقيه فيلد ها متمايز شود؟

فصل هفتم – پشتیبانی از مرورگر ها و ابزار های مختلف

  • سايت طراحی شده خود را بايد در چه مرورگر هايی تست كنم؟
  • بر روی سيستم من فقط يک سيستم عامل نصب شده است. چگونه می توانم سايت خود را در مرورگر های يک سيستم عامل ديگر تست كنم؟
  • آيا خدماتی وجود دارد كه سايت طراحی شده مرا در محيط مرورگر های مختلف به من نشان دهد؟
  • آيا من می توانم چندين نسخه متفاوت از مرورگر Internet Explorer را بر روی ویندوز نصب کنم؟
  • چگونه می توانم سايت خود را در مرورگر هايی كه فقط متن را پشتيبانی می كنند تست كنم؟
  • چگونه می توانم سايت خود را در يک برنامه صفحه خوان تست كنم؟
  • چگونه می توانم فايل CSS را از دید مرورگر Netscape 4 مخفی کنم؟
  • چگونه می توانم برگه سبكی مخصوص مرورگر Netscape 4 ایجاد کنم؟
  • چگونه می توانم برای كسانی كه از مرورگر های نسخة 4 استفاده می كنند، يک پيغام قرار دهم و دليل درست نمايش داده نشدن سايت را برای آنها شرح دهم؟
  • چگونه می توانم فابل CSS را از دید دیگر مرورگر ها مخفی کنم؟
  • چرا سايت طراحی شده توسط من در مرورگر های Internet Explorer 6 و موزیلا به شکل متفاوتی نمایش داده می شود؟
  • من فکر می کنم که یک اشکال در CSS پیدا کرده ام حالا باید چیکار کنم؟
  • بخشی از محتوای سايت من در مرورگر Internet Explorer 6 گاهی ظاهر و دوباره محو می شود باید چیکار کنم ؟
  • پيغام های هشدار يا خطايی كه هنگام تاييد كردن سند در تايید كننده W3C دریافت می کنم بیان کننده چیست؟
  • چگونه می توانم برای ابزار خاص مانند ابزار های صفحه خوان یک برگه سبک مخصوص ایجاد کنم؟
  • چگونه می توانم برگه سبک مخصوص چاپ ايجاد كنم؟
  • بعضی از مرورگر ها به كاربران اين اجازه را می دهند كه از بين چند برگه سبک موجود، يكی را انتخاب كنند. چگونه می توانم چند برگه سبک را به صفحه خود متصل كنم تا كاربران بتوانند يكی را به دلخواه انتخاب كنند؟
  • چگونه می توانم يک تعويض كننده برگه سبک ايجاد كنم؟
  • چگونه از برگه های سبک انتخابی استفاده كنم، بدون اينكه لازم باشد همه دستورات CSS برگه سبک اصلی را در برگه سبک دوم كپی كنم؟

فصل هشتم – طراحی و موقعیت دهی عناصر با استفاده از CSS

  • چگونه متوجه شوم كه در چه زمانی بايد از كلاس در چه زمانی باید از شناسه استفاده کنم؟
  • آيا من می توانم يک عنصر درون خطی را همانند يک عنصر بلوک و یا یک عنصر بلوک را همانند يک عنصر درون خطی نمايش دهم؟
  • چگونه حاشیه ها و فاصله درونی را در CSS تعریف کنم؟
  • چگونه من می توانم متن را در كنار تصوير منظم كنم، بدون اينكه از ويژگی align در HTML  استفاده کنم؟
  • چگونه از حركت عناصر به سمت بالا در هنگام استفاده از خصوصيت float جلوگیری کنم؟
  • چگونه می توانم لوگو و تيتر سايت را در سمت چپ و يا راست منظم كنم، بدون اينكه از برچسب <table> استفاده کنم؟
  • چگونه موقعيت يک عنصر را در صفحه با استفاده از CSS تعیین کنم؟
  • چگونه يک بلوک را با استفاده از CSS در وسط صفحه موقعیت دهی کنم؟
  • آيا من می توانم همان طرح قبلی را به شكل معكوس در آورم، به طوری كه فهرست در سمت راست و محتوا در سمت چپ باشد؟
  • چگونه من می توانم يک طرح دو ستونی با عرض ثابت و متمركز در وسط صفحه ايجاد كنم؟
  • چگونه می توانم يک طرح سه ستونی را با استفاده از CSS ایجاد کنم؟
  • چگونه يک پاورقی مناسب را با استفاده از CSS به صفحه اضافه کنم؟
  • چگونه يک گالری از تصاوير بند انگشتی را بدون استفاده برچسب <table> ایجاد کنم؟

فصل نهم – خصوصیات ویژه CSS برای مرورگر های خاص، و تكنیک های قابل استفاده در آینده

  • چگونه می توانم نوار پيمايش طولی را با رنگی متفاوت سبک دهی کنم؟
  • چگونه می توانم يک فهرست برای سايت خودم ايجاد كنم كه هنگام پيمايش صفحه در جای خود ثابت بماند؟
  • چگونه می توانم بخش ناوبری را به شكل ثابت در صفحه قرار دهم به طوريكه در Internet Explorer نيز اين بخش در صفحه ثابت باشد و پيمايش (scroll) نشود؟
  • آيا من می توانم ک پاورقی در صفحه ايجاد كنم كه همانند يک فريم، هنگام پيمايش صفحه در جای خود ثابت بماند و حركت نكند؟
  • آيا می توانم يک فهرست پايين افتادنی را تنها با استفاده از CSS ایجاد کنم؟
  • آيا من می توانم با استفاده از CSS گوشه های گرد برای عناصر صفحه ايجاد كنم؟
  • آيا می توانم برای عناصر صفحه، گوشه های گرد ايجاد كنم به طوی كه بر روی تمامی مرورگر ها قابل استفاده باشد؟
  • چگونه يک عنصر را در صفحه به شكل نيمه شفاف در آورم به طوری كه در مرورگر های Internet Explorer و مرورگر های نسل موزيلا به خوبی كار كند؟
  • چگونه می توانم با استفاده از CSS به کاربران نشان دهم كه كدام لينک ها، لينک به مطالب داخلی و كدام لينک ها، لينک به صفحات خارج سايت است؟
  • آيا من می توانم با استفاده از CSS متنی را به صفحه خود اضافه كنم؟
  • چگونه می توانم حرف اول يا خط اول يک بلوک متن را به شكل متفاوتی از بقيه متن سبک دهی كنم؟
  • آيا استفاده از جلوه هايی كه فقط در گروه خاصی از مرورگر ها اجرا می شوند، كار اشتباهی است؟
 

باکس دانلود
ثبت نظر
ریفریش کنید!
نظرات کاربران (۱ مورد)
  1. تصویر آواتار کاربر 0
    آرمین اکبرزاده شنبه , 15 دی

    سلام کتاب مرجع کامل جاوا رو می خواستم آیا همچین کتابی در دسترستون هست ؟