حاشیه ها و بالشتک ها می توانند گیج کننده باشند زیرا، از برخی جهات، شبیه به هم هستند: فضای سفید در اطراف یک تصویر یا شی. در اینجا چیزی است که شما به عنوان یک طراح وب باید در مورد تفاوت های آنها بدانید.
Padding
Padding فضایی بین محتوای یک تصویر یا سلول و حاشیه بیرونی آن است. در تصویر زیر، بالشتک، ناحیه زرد رنگ اطراف محتوا است. در این مورد، بالشتک به طور کامل در اطراف محتویات می رود: سمت بالا، پایین، سمت راست و چپ. شما می توانید تعیین کنید چه مقدار بالشتک (در درصد، پیکسل، امتیاز و غیره) برای هر طرف، و لازم نیست که آنها یکسان باشند. به این ترتیب، می توانید محتوا را در یک عنصر قرار دهید.
حاشیه
در مقابل، حاشیه ها فضاهای خارج از مرز یک عنصر، بین عنصر و هر چیزی که مجاور آن است، هستند. در تصویر، حاشیه، ناحیه سفید خارج از کل جسم است. مانند padding، حاشیه به طور کامل در اطراف محتویات در این مثال می رود: در سمت بالا، پایین، سمت راست و چپ. می توانید از حاشیه ها برای قرار دادن div ها و سایر عناصر در یک صفحه استفاده کنید.
همیشه صفحات خود را در مرورگرها، سیستم عامل های مختلف (از جمله تلفن همراه) و اندازه صفحه آزمایش کنید تا مطمئن شوید دقیقاً همانطور که می خواهید نمایش داده می شوند.
