امتیاز موضوع:
  • 21 رأی - میانگین امتیازات: 2.48
  • 1
  • 2
  • 3
  • 4
  • 5
کار با تصویر زمینه در طراحی صفحات با استایل
#1

[تصویر:  iPad-Landscape-Blue-Background-icon.png]
کار با تصویر زمینه در طراحی صفحات با استایل

ما با استفاده از شناسه[/url][url=background ]background در تگ می توانستیم برای صفحه تصویر زمینه مشخص کنیم. اما با استفاده از استایل می توانیم کنترل بیشتری بر این تصویر زمینه داشته باشیم چه این تصویر زمینه برای کل صفحه استفاده شود چه برای قسمت مشخصی از صفحه. برای مثال می توانیم تصویر زمینه را به گونه ای تعریف کنیم که تکرار نشود، ثابت باشد، یا برای آن نقطه شروع تعیین کنیم. برخی از این خواص را می توانید در جدول زیر ملاحظه کنید:
[تصویر:  13459896601.bmp]

برای استفاده از این ویژگیها و کاربرد آنها برای تگ BODY می توانید یک استایل در قسمت HEAD متن تعریف کنید یا از استایل خارجی استفاده کنید. مثلاً می توان در قسمت HEAD متن یک استایل به صورت زیر تعریف کرد:


background-repeat

همانطور که در درس قبل ملاحظه کردید در مورد background-image توضیحاتی داده شد. در اینجا به سایر ویژگیهای مربوط به تصویر زمینه می پردازیم.

این ویژگی تعیین کننده نوع تکرار شدن تصویر زمینه است. در اینجا مقادیری را که می توان به این ویژگی اختصاص داد بیان می کنیم:
  • repeat
    این مقدار تعیین می کند که تصویر زمینه در صورتی که از اندازه پنجره کوچکتر بود هم به صورت افقی و هم عمودی تکرار شود تا همه زمینه پنجره را بپوشاند.
  • no-repeat
    این گزینه مشخص می کند که تصویر زمینه نباید تکرار شود حتی اگر از اندازه پنجره کوچکتر بود.
  • repeat-x
    این گزینه مشخص می کند که تصویر باید به صورت افقی تکرار شود نه عمودی.
  • repeat-y
    این گزینه مشخص می کند که تصویر زمینه باید به صورت عمودی تکرار شود.
background-attachment

از این ویژگی برای تعیین موقعیت تصویر زمینه در هنگام بالا و پایین بردن صفحه به وسیله اسکرول بار در پنجره مرورگر است. مقادیر زیر را می توان برای این ویژگی استفاده کرد:
  • [b]scroll
    اگر این گزینه را انتخاب کنید تصویر زمینه به همراه محتویات صفحه به بالا و پایین می رود.
  • fixed
    با انتخاب این گزینه مشخص می کنید که تصویر زمینه در هنگام حرکت کردن محتویات صفحه باید ثابت بماند و حرکت نکند.
    کد زیر را می توان برای مشخص کردن تصویر زمینه ثابت در بخش HEAD متن استفاده کرد. در این مثال لوگوی سایت ما به عنوان زمینه ثابت در نظر گرفته شده است.


[/b]
پاسخ


موضوعات مرتبط با این موضوع...
موضوع نویسنده پاسخ بازدید آخرین ارسال
  اعمال تغییر بر روی لینکها در صفحه با استفاده از استایل انجمن مخ ها 0 243 27-08-2012، 09:06 PM
آخرین ارسال: انجمن مخ ها
  تغییر شکل نشانگر ماوس با استفاده از استایل انجمن مخ ها 0 242 27-08-2012، 08:58 PM
آخرین ارسال: انجمن مخ ها
  تغییر رنگ و تصویر زمینه عناصر HTML با CSS انجمن مخ ها 0 265 26-08-2012، 06:24 PM
آخرین ارسال: انجمن مخ ها
  تنظیم فونت صفحه با استفاده از استایل(CSS) انجمن مخ ها 0 233 26-08-2012، 02:29 PM
آخرین ارسال: انجمن مخ ها
  نحوه ایجاد کادر برای عناصر صفحه با استفاده از استایل انجمن مخ ها 1 281 25-08-2012، 07:32 PM
آخرین ارسال: انجمن مخ ها
  استفاده از کلاس و id در طراحی صفحات با CSS انجمن مخ ها 1 210 24-08-2012، 04:46 PM
آخرین ارسال: انجمن مخ ها

پرش به انجمن:


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