چگونه تصویری را به‌عنوان عکس پس‌زمینه در HTML تنظیم کنیم

به‌طور مشارکتی نوشته شده با همکاری کادر فنی ویکی‌هاو

اگر می‌خواهی عکسی را در یک صفحه‌ی وب قرار بدهی، تنها چیزی که لازم داری HTML است. اگر می‌خواهی عکسی را به‌عنوان پس‌زمینه‌ در یک صفحه‌ی وب قرار بدهی به HTML و همچنین CSS نیاز داری. HTML مخفف عبارت Hypertext Markup Language (زبان نشانه‌گذاری ابرمتن) و کدی است که به مرورگر می‌گوید چه چیزی را در صفحه‌ی وب نمایش بدهد. CSS مخفف عبارت Cascading Style Sheets (شیوه‌نامه‌ی آبشاری) است و برای تغییر ظاهر و طرح یک صفحه‌ی وب مورد استفاده قرار می‌گیرد. برای تنظیم عکس پس‌زمینه به یک تصویر که می‌خواهی در وب‌سایت خودت از آن استفاده کنی نیاز داری.

مراحل

بخش 1

بخش 1 از 4:

تنظیم کردن فایل‌ها

1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/c\/c6\/2627945-1-3.jpg\/v4-460px-2627945-1-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/c\/c6\/2627945-1-3.jpg\/v4-728px-2627945-1-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   1
   پوشه‌ای ایجاد کن و فایل HTML و تصویر پس‌زمینه‌ی مورد‌نظرت را داخل آن قرار بده. پوشه‌ای داخل کامپیوترت ایجاد کن و برای آن اسمی درنظر بگیر تا بتوانی بعداً آن را به‌راحتی پیدا کنی.

   • می‌توانی روی پوشه‌ات هر اسمی که می‌خواهی بگذاری ولی بهتر است هنگام کار کردن با HTML، خودت را به نامگذاری پوشه‌ها و فایل‌ها به‌صورت کلمات کوتاه، ساده و اسامی قابل تشخیص عادت بدهی.
2. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/c\/cd\/2627945-2-3.jpg\/v4-460px-2627945-2-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/c\/cd\/2627945-2-3.jpg\/v4-728px-2627945-2-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   2
   تصویر پس‌زمینه را در پوشه‌ی HTML قرار بده. تصویری که می‌خواهی از آن به‌عنوان پس‌زمینه استفاده کنی را در پوشه‌ی HTML قرار بده.

   • اگر خیلی نگران این نیستی که وب‌سایت تو در دستگاه‌های قدیمی‌تر و با ارتباط اینترنت کند‌‌تر خوب کار کند، می‌توانی با خیال راحت از عکس‌هایی که کیفیت بالایی دارند برای پس‌زمینه استفاده کنی. همچنین تصاویر ساده با الگو‌های سبک و تکراری، گزینه‌ی مناسبی برای عکس‌های پس‌زمینه هستند چرا‌که در‌صورت قرار گرفتن متن روی آن‌ها، متن به‌راحتی قابل خواندن است.

   نکته: اگر تصویر مناسبی برای این کار نداری می‌توانی یک تصویر پس‌زمینه‌ی رایگان را دانلود کنی. در‌صورت دانلود کردن عکس، آن را داخل پوشه‌ی HTML که ایجاد کرده‌ای قرار بده.
3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/d\/d3\/2627945-3-3.jpg\/v4-460px-2627945-3-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/d\/d3\/2627945-3-3.jpg\/v4-728px-2627945-3-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   3
   یک ویرایشگر متن یا ویرایشگر HTML را باز کن. می‌توانی فایل HTML مورد‌نظرت را با استفاده از یک ویرایشگر ساده‌ی متن مثل NotePad در ویندوز یا TextEdit در مک ایجاد کنی. همچنین می‌توانی از ویرایشگرهای HTML که برپایه‌ی what-you-see-is-what-you-get (WYSIWYG) (آنچه که می‌بینی همان است که به‌دستت می‌رسد) مانند برنامه‌ی Adobe Dreamweaver استفاده کنی.

   • اگر از ویرایشگر‌های WYSIWYG استفاده می‌کنی، در شروع صفحه روی گزینه‌‌‌ای که برای باز کردن فایل HTML جدید است، کلیک کن.
4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/f\/fc\/2627945-4-3.jpg\/v4-460px-2627945-4-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/f\/fc\/2627945-4-3.jpg\/v4-728px-2627945-4-3.jpg","smallWidth":460,"smallHeight":344,"bigWidth":728,"bigHeight":544,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   4
   روی File کلیک کن. این گزینه داخل نوار منوی بالای صفحه قرار دارد.
5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/e\/e1\/2627945-5-3.jpg\/v4-460px-2627945-5-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/e\/e1\/2627945-5-3.jpg\/v4-728px-2627945-5-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   5
   روی Save As (ذخیره به عنوان) در Notepad یا Save (ذخیره) در TextEdit کلیک کن. این گزینه در منوی فایل قرار دارد. اگر از کامپیوتر ویندوزی استفاده می‌کنی، روی Save As (ذخیره به عنوان) در منوی کشویی "File" کلیک کن. اگر از مک استفاده می‌کنی روی Save (ذخیره) در منوی کشویی کلیک کن.
6. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/d\/dd\/2627945-6-3.jpg\/v4-460px-2627945-6-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/d\/dd\/2627945-6-3.jpg\/v4-728px-2627945-6-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   6
   برای سند HTML خودت اسمی انتخاب کن. به‌طورکلی صفحه‌ی اول یک وب‌سایت، "index" (فهرست) نامیده می‌شود ولی تو می‌توانی هر اسمی که خواستی را برای آن انتخاب کنی. اسم موردنظرت را در کادر متنی کنار "File Name" (اسم فایل) بنویس.
7. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/3\/33\/2627945-7-3.jpg\/v4-460px-2627945-7-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/3\/33\/2627945-7-3.jpg\/v4-728px-2627945-7-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   7
   نوع فایل را به سند HTML تغیر بده. اگر از ویرایشگر WYSIWYG استفاده می‌کنی، فقط کافی است تا فایل را ذخیره کنی. ولی اگر برای ساختن HTML از NotePad یا TextEdit استفاده می‌کنی، مراحل زیر را برای ذخیره‌ی سند با قالب HTML دنبال کن.

   • در Notepad: افزونه‌ی فایل را که در انتهای نام فایل به‌صورت "txt." نوشته شده است به "html." تغییر بده.
   • در TextEdit: از منوی کشویی که در کنار "File Format" (قالب فایل) قرار دارد، Wep page (.html) را انتخاب کن.
8. 8
   روی Save (ذخیره) کلیک کن. این گزینه در گوشه‌ی سمت راست و پایین پنجره قرار دارد. با انجام این کار سند متنی تو در قالب فایل HTML ذخیره خواهد شد.

بخش 2

بخش 2 از 4:

نوشتن فایل HTML

1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/e\/e2\/2627945-8-3.jpg\/v4-460px-2627945-8-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/e\/e2\/2627945-8-3.jpg\/v4-728px-2627945-8-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   1
   کد <!DOCTYPE html> را در بالای فایل HTML تایپ کن. کد‌های HTML از تگ‌های باز و بسته ساخته شده‌اند. هر صفحه‌ی HTML که به‌درستی ساخته شده باشد، باید با <DOCTYPE html!> شروع شود. این کد به مرورگر وب می‌گوید که این فایل یک فایل HTML است.
2. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/a\/a2\/2627945-9-3.jpg\/v4-460px-2627945-9-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/a\/a2\/2627945-9-3.jpg\/v4-728px-2627945-9-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   2
   کد <!DOCTYPE html> را در خط بعدی تایپ کن. این کد، تگ آغازین HTML تو است. این کد به مرورگر وب می‌گوید که کد HTML از اینجا شروع می‌شود.
3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/c\/cc\/2627945-10-3.jpg\/v4-460px-2627945-10-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/c\/cc\/2627945-10-3.jpg\/v4-728px-2627945-10-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   3
   کد <head> را در سطر بعدی تایپ کن. این کد، تگ آغازین قسمت Head (سرانداز) فایل HTML است. قسمت Head (سرانداز) شامل اطلاعاتی است که در مرورگر وب نمایش داده نمی‌شود. این قسمت شامل اطلاعاتی مانند عنوان صفحه و همچنین شیوه‌نامه‌ی آبشاری (CSS) است که ظاهر کد HTML را قالب‌بندی می‌کند.
4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/f\/ff\/2627945-11-3.jpg\/v4-460px-2627945-11-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/f\/ff\/2627945-11-3.jpg\/v4-728px-2627945-11-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   4
   کد <title>Page Title</title> را تایپ کن. این کد HTML شامل عنوان صفحه‌ی وب تو است. تگ "<title>"، تگ آغازین کد HTML عنوان صفحه‌ است. تگ"<title/>" نیز تگ پایانی آن است. عبارت "Page Title" (عنوان صفحه) را با هر عنوانی که برای صفحه‌ی HTML انتخاب کرده‌ای جایگزین کن. این عنوان در زبانه‌ی مرورگر که در قسمت بالای مرورگر قرار دارد نمایش داده خواهد شد.
5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/b\/b0\/2627945-12-3.jpg\/v4-460px-2627945-12-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/b\/b0\/2627945-12-3.jpg\/v4-728px-2627945-12-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   5
   کد <head/> را در سطر بعدی تایپ کن. این کد، تگی است که بخش head (سرانداز) سند HTML را می‌بندد. اگر می‌خواهی اطلاعات دیگر و استایل شیت‌ها یا همان شیوه‌نامه‌هایی را به سند HTML اضافه کنی، باید آن‌ها را بعد از تگ بازشونده "<head>" و قبل از تگ بسته شونده‌ی "<head/>" بنویسی.
6. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/1\/12\/2627945-13-3.jpg\/v4-460px-2627945-13-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/1\/12\/2627945-13-3.jpg\/v4-728px-2627945-13-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   6
   کد <body> را در سطر بعدی تایپ کن. این کد، تگ ابتدایی بخش body (بدنه‌) سند HTML تو است. بخش body (بدنه) جایی است که تمام عناصر بصری صفحه‎‌ی وب در آنجا قرار می‌گیرند. این عناصر شامل متن، تصاویر، دکمه‌ها و سایر عناصر‌ قابل مشاهده در صفحه‌ی وب هستند.
7. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/1\/1d\/2627945-14-3.jpg\/v4-460px-2627945-14-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/1\/1d\/2627945-14-3.jpg\/v4-728px-2627945-14-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   7
   کد <div style="background-image:url('[image url]');">را در سطر بعد تایپ کن. این تگ HTML، تصویر را به پس‌زمینه‌ی صفحه‌ی وب تو اضافه می‌کند. قسمت "[image url]" را با آدرس url یا آدرس محل قرارگفتن عکسی که می‌خواهی اضافه کنی جایگزین کن. این آدرس می‌تواند محل عکس بارگذاری شده در سرور آنلاین یا یک پوشه در کامپیوتر شخصی تو باشد.

   • همچنین می‌توانی تصویر پس‌زمینه را با استفاده از CSS تنظیم کنی.
   • وقتی به‌جای آدرس فایل یا URL عکس فقط از اسم فایل استفاده می‌کنی (به‌عنوان مثال، background-image: url("background.png"))، مرورگر وب پوشه‌ی صفحه‌ی‌‌ وب مورد‌نظر را برای پیدا کردن عکس جستجو می‌کند. اگر فایل عکس در پوشه‌ی دیگری در کامپیوترت باشد، باید آدرس کامل آن فایل را اضافه کنی.
8. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/6\/6d\/2627945-15-3.jpg\/v4-460px-2627945-15-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/6\/6d\/2627945-15-3.jpg\/v4-728px-2627945-15-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   8
   قسمت‌های دیگر سند HTML را تکمیل کن. اگر می‌خواهی عناصر دیگری مثل متن، عکس‌، ویدئو‌، لینک‌، دکمه‌ و غیره را به صفحه‌ی HTML خودت اضافه کنی، باید آن‌ها را در قسمت "Body" (بدنه‌ی) سند HTML وارد کنی.
9. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/a\/a6\/2627945-16-3.jpg\/v4-460px-2627945-16-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/a\/a6\/2627945-16-3.jpg\/v4-728px-2627945-16-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   9
   کد <body/> را در خط آخر بنویس. این کد، تگ انتهایی بخش body (بدنه‌ی) سند HTML تو است. وقتی‌که تمام عناصری که می‌خواهی در HTML باشند را وارد کردی، این تگ را به انتهای خط آخر اضافه کن.
10. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/0\/0a\/2627945-17-3.jpg\/v4-460px-2627945-17-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/0\/0a\/2627945-17-3.jpg\/v4-728px-2627945-17-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    10
    کد <html/> را در آخرین خط تایپ کن. این کد همان تگی است که با آن کل سند HTML بسته می‌شود. این تگ را در خط آخر اضافه کن.
11. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/a\/a8\/2627945-18-3.jpg\/v4-460px-2627945-18-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/a\/a8\/2627945-18-3.jpg\/v4-728px-2627945-18-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    11
    فایل HTML را ذخیره کن. وقتی کارت تمام شد، روی File و سپس روی Save (ذخیره) کلیک کن تا فایلت ذخیره شود. کل سند HTML تو باید چیزی شبیه به این باشد:

    <!DOCTYPE html>
    <html>
    <head>
    <title>Page Title</title>
    </head>
    <body>
    <div style="background-image: url('https://www.website.com/images/image_background.jpg');">
    </body>
    </html>
    

بخش 3

بخش 3 از 4:

با استفاده از CSS

1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/f\/fc\/2627945-19-3.jpg\/v4-460px-2627945-19-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/f\/fc\/2627945-19-3.jpg\/v4-728px-2627945-19-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   1
   یک سند HTML ایجاد کن. برای انجام این کار از مراحلی که در قسمت ۲ برای نوشتن سند HTML به آن اشاره شد استفاده کن. سند تو باید شامل تگ آغازین و پایانی HTML، تگ آغازین و پایانی head (سرانداز) و همچنین تگ آغازین و پایانی body (بدنه) باشد. برای اضافه کردن عکس نیازی به افزودن تگ HTML نیست. در این قسمت یاد می‌گیری که چگونه تصویر پس‌زمینه‌ را به‌جای HTML با استفاده از CSS تنظیم کنی.
2. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/5\/5e\/2627945-20-3.jpg\/v4-460px-2627945-20-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/5\/5e\/2627945-20-3.jpg\/v4-728px-2627945-20-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   2
   کد <style> را در بخش head (سرانداز) سند HTML تایپ کن. این کد، تگ آغازین شیوه‌نامه‌ی (CSS) است. این تگ بعد از "<head>" و قبل از "<head/>" قرار می‌گیرد.

   • همچنین می‌توانی CSS را در یک سند CSS مجزا ایجاد کرده و سپس آن را به سند HTML خودت ارتباط بدهی.
3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/3\/35\/2627945-21-3.jpg\/v4-460px-2627945-21-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/3\/35\/2627945-21-3.jpg\/v4-728px-2627945-21-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   3
   کد } body را در خط بعدی تایپ کن. این کد، کد آغازین CSS است که به بدنه‌ی سند HTML تو شکل و رنگ می‌دهد.
4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/d\/d4\/2627945-22-3.jpg\/v4-460px-2627945-22-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/d\/d4\/2627945-22-3.jpg\/v4-728px-2627945-22-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   4
   کد background-image: url('[image url]'); را در سطر بعدی تایپ کن. این خط مشخص‌کننده تصویر پس‌زمینه‌ای است که می‌خواهی استفاده کنی. قسمت "[image url]" را با آدرس url صحیح عکسی که می‌خواهی استفاده کنی جایگزین کن.

   • وقتی به‌جای آدرس فایل یا URL عکس فقط اسم فایل را استفاده می‌کنی (به‌عنوان مثال، background-image: url("background.png"))، مرورگر وب پوشه‌ی صفحه‌‌ وب مورد‌نظر را برای پیدا کردن عکس جستجو می‌کند. اگر فایل عکس در پوشه‌ی دیگری در کامپیوترت قرار داشته باشد، باید آدرس کامل آن فایل را اضافه کنی.
5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/7\/78\/2627945-23-3.jpg\/v4-460px-2627945-23-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/7\/78\/2627945-23-3.jpg\/v4-728px-2627945-23-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   5
   کد ;background-repeat:no-repeat را در سطر بعدی تایپ کن. این خط به مرورگر وب می‌گوید که تصویر مورد‌نظر را به‌جای نمایش مکرر فقط یک بار نمایش دهد.
6. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/7\/7e\/2627945-24-3.jpg\/v4-460px-2627945-24-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/7\/7e\/2627945-24-3.jpg\/v4-728px-2627945-24-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   6
   کد ;background-size: cover را در سطر بعدی تایپ کن. این کد به مرورگر وب می‌گوید تا کل پس‌زمینه را با عکس موردنظرت پوشش دهد.
7. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/6\/6c\/2627945-25-3.jpg\/v4-460px-2627945-25-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/6\/6c\/2627945-25-3.jpg\/v4-728px-2627945-25-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   7
   علامت } را در انتهای بخش "Body" (بدنه‌ی) فایل HTML تایپ کن. اگر می‌خواهی خطوط CSS دیگری که در قسمت Body (بدنه‌ی) سند HTML تو تغییراتی را ایجاد می‌کنند اضافه کنی، باید آن‌ها را اینجا بنویسی. برای بستن قسمت بدنه، "{" را در آخرین خط قسمت "Body" (بدنه) CCS وارد کن.
8. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/c\/c1\/2627945-26-3.jpg\/v4-460px-2627945-26-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/c\/c1\/2627945-26-3.jpg\/v4-728px-2627945-26-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   8
   کد <style/> را در انتهای CSS تایپ کن. بعد از اینکه تمام CSS‌هایی که می‌خواستی را اضافه کردی، در انتها کد "<style/>" را تایپ کن. این کد CSS را می‌بندد.
9. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/3\/30\/2627945-27-3.jpg\/v4-460px-2627945-27-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/3\/30\/2627945-27-3.jpg\/v4-728px-2627945-27-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   9
   فایل HTML را ذخیره کن. وقتی‌ کارت تمام شد، برای ذخیره‌ی فایل، روی File و سپس روی Save (ذخیره) کلیک کن. کل سند HTML تو باید به‌شکل زیر باشد:

   <!DOCTYPE html>
   <html>
   <head>
   <title>Page Title</title>
   
   <style>
   body {
           background-image: url("https://www.website.com/images/image_background.jpg");
           background-repeat:no-repeat;
          background-size:cover;
   } 
   </style>
   </head>
   <body>
   
   </body>
   </html>
   

بخش 4

بخش 4 از 4:

مرور فایل HTML

1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/b\/bb\/2627945-28-3.jpg\/v4-460px-2627945-28-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/b\/bb\/2627945-28-3.jpg\/v4-728px-2627945-28-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   1
   روی سند HTML راست کلیک کن. با انجام این کار منویی در سمت راست آن نمایش داده می‌شود.
2. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/1\/15\/2627945-29-3.jpg\/v4-460px-2627945-29-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/1\/15\/2627945-29-3.jpg\/v4-728px-2627945-29-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   2
   روی گزینه‌ی Open with (بازکردن به‌وسیله‌ی) کلیک کن. با انجام این کار لیستی از برنامه‌هایی که می‌توانی فایل HTML را در آن‌ها باز کنی نمایش داده می‌شود.
3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/6\/62\/2627945-30-3.jpg\/v4-460px-2627945-30-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/6\/62\/2627945-30-3.jpg\/v4-728px-2627945-30-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   3
   مرورگر وب موردنظرت را انتخاب کن. می‌توانی فایل HTML مورد‌نظرت را در هر مرورگری که خواستی باز کنی.
4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/3\/36\/2627945-31-3.jpg\/v4-460px-2627945-31-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/3\/36\/2627945-31-3.jpg\/v4-728px-2627945-31-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   4
   فایل HTML را مرور کن. نگاهی به فایل HTML بینداز و مطمئن شو که همه‌چیز درست است.

   • اگر مرورگر را باز کردی و به‌جای تصویر پس‌زمینه، کد‌های HTML را مشاهده کردی، احتمالاً فایل HTML را به‌جای ذخیره به‌عنوان HTML در قالب فایل txt. یا rtf ذخیره کرده‌ای. لازم است تا فایل HTML را در ویرایشگر دیگری ویرایش کنی.

   توجه: اگر مروگر را باز کردی و عکس پس‌زمینه را مشاهده نکردی، فایل index.html را در ویرایشگر متنی ویندوز بررسی کن تا مطمئن شوی اسم فایل را درست تایپ کرده‌ای
5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/f\/f7\/2627945-32-3.jpg\/v4-460px-2627945-32-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/f\/f7\/2627945-32-3.jpg\/v4-728px-2627945-32-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
   5
   ویرایش‌هایی در فایل HTML انجام بده. در ویرایشگر متنی ویندوز، نشانگر ماوس را بین تگ‌های <body> </body> ببر و عبارت !Hello world (سلام دنیا!) را تایپ کن. برای دیدن متن بالای تصویر پس‌زمینه، پنجره‌ی مرورگر را دوباره بارگذاری کن.