زبان نشانه گذاری HTML به یک طراح وب اجازه می دهد تا از هر تصویری به عنوان تصویر پس زمینه استفاده کند. با این حال ، این زبان خود فاقد کنترل داخلی برای تصاویر پس زمینه است. تنظیم دقیق بیشتری با استفاده از شیوه نامه های CSS آبشار انجام می شود.
دستورالعمل ها
مرحله 1
برای کشیده شدن پس زمینه به عرض کامل مرورگر ، باید از پارامتر z-index در CSS خود استفاده کنید. به شما امکان می دهد ترتیب عناصر ایجاد شده را تنظیم کنید. هرچه مقدار این ویژگی بیشتر باشد ، بلوک بالاتر در صفحه قرار می گیرد.
گام 2
اسناد جدیدی را با فرمت html و css ایجاد کنید (دکمه سمت راست ماوس - "جدید" - "فایل متنی") و آنها را با استفاده از ویرایشگر متن باز کنید.
مرحله 3
تصویر پس زمینه را در لایه پایین قرار دهید. بسته به وضوح صفحه نمایش کشیده می شود. در بالا ، عنصر دیگری قرار خواهد گرفت که محتوای صفحه بر روی آن نمایش داده می شود. برای این کار ، دو بلوک ایجاد کنید. در پرونده css بنویسید:.1layer {z-index: 1؛ عرض: 100٪ ارتفاع: 100٪ موقعیت: مطلق؛}. 2 لایه {موقعیت: مطلق؛ z-index: 2؛ } موقعیت: پارامتر مطلق به شما امکان می دهد موقعیت مطلق را تنظیم کنید ، یعنی لایه مستقل از عناصر دیگر قرار می گیرد.
مرحله 4
کد CSS تولید شده را با استفاده از برچسب پیوند در پرونده HTML قرار دهید: پس زمینه صفحه
مرحله 5
یک لایه جدید ایجاد کنید. با استفاده از برچسب
یک عکس روی آن قرار دهید. به عنوان مثال: محتوای صفحه برای img ، فقط پارامتر عرض مشخص شده است ، زیرا اگر علاوه بر آن ارتفاع را تعیین کنید ، در برخی از مرورگرها ، اعوجاج تصویر ظاهر می شود.
مرحله 6
تغییرات خود را ذخیره کنید. برای آزمایش کد ، صفحه را در پنجره مرورگر خود بزرگ کنید. تصویر پس زمینه نیز باید بزرگ شود.
