استفاده از پس زمینه ثابت در وب سایت

دوشنبه, ۶ام آبان , ۱۳۸۷ | ۶ دیدگاه

تا حالا پیش آمده که وب سایتی رو ببینید که عکس پس زمینه اون ثابت باشه (به این سایت ساده نگاهی بیاندازید)  ولی در عین حال صفحه scroll هم داشته باشه ؟

اینکار به سادگی انجام میگیره و اضافه کردن چند خط به سورس کد CSS امکان پذیر میشود :

کافیه که این چند خط رو به فایل CSS و یا در صورتیکه فایل CSS ندارید به صفحه HTML سایتتون و بین تگهای <head> و </head> اضافه کنید .

  1. <style type=“text/css”>
  2. body
  3. {
  4. background-image: url(“image.gif”);
  5. background-repeat: no-repeat;
  6. background-attachment: fixed;
  7. background-position: center;
  8. }
  9. </style>

background-image : آدرس دهی فایل عکس برای قرار گرفتن بصورت پس زمینه

backgroud-repeat : رفتار پس زمینه را مشخص میکند و میتواند Repeat(تکرار عکس در جهت افقی و عمودی) Repeat-x(تکرار در جهت عمودی) Repeat-y(تکرار در جهت افقی) و no-Repeat(بدون تکرار) را پذیرا باشد .

background-attachment : تعیین اینکه پس زمینه دارای اسکرول(scroll) و یا ثابت (fixed) باشد .

background-position : تعیین موقعیت (وقتی فعال است که اندازه عکس از اندازه صفحه کوچکتر باشد)

Be Sociable, Share!


۶ دیدگاه


  1. آرمان
    ۶ آبان ۱۳۸۷

    استفاده بردم .ممنون.




  2. sajjad
    ۳۰ شهریور ۱۳۸۸

    خیلی جالب بود مرسی.




  3. بنیامین
    ۱۸ شهریور ۱۳۸۹

    ممنون از مطلب جالبتون.
    لطفا این مطالب رو در یک قسمت جداگانه با عنوان ” ترفند ها ” قرار بدین.

    با تشکر




  4. محمد
    ۱۶ خرداد ۱۳۹۰

    یه سوال از چه امکان CSS استفاده کرده که نمیشه متن را کپی کرد؟؟ :-/




  5. آرمان
    ۲۷ مرداد ۱۳۹۰

    ببخشید یه سوال داشتم ؟؟؟
    میشه درباره ی background-position بیشتر توضیح بدید و مثلا بزنید ممنون میشم




  6. محمد
    ۲۶ بهمن ۱۳۹۰

    سلام میخواستم بدونم این کدها رو باید کجا و در شاخه چی ذخیره کرد در html
    در اینجا : ?/
    public_html/themes/Name theme
    در فایل
    index.html
    یا در شاخه :
    style
    در فایل
    index.html

    ممنون میشم راهنمایی کنین



دیدگاه خود را بنویسید