پاسخ ها (1)
1
Tavana
برای جلوگیری از تکرار، باید از no-repeat استفاده کنید برای مثال در هدر برای جلوگیری از دوبار تکرار شدن عکس می توانید کد زیر را بنویسید
<div id="header" style='background:url("آدرس عکس") no-repeat center'>
در این مثال عکس فقط یکبار نمایش داده می شود و البته در مرکز هدر. در صورتی که می خواهید در سمت چپ نمایش داده شود به جای center از left و در صورتی که می خواهید از سمت راست نمایش داده شود از right استفاده کنید.
در مورد بک گراند عکسی که انتخاب کردید چون بزرگتر است به ناچار بخشی از آن نمایش داده نمی شود. برای اینکه تمام عکس نمایش داده شود می توانید از
background-size: contain;
استفاده کنید که تمام عکس را به نمایش در می آورد. گزینه های دیگری هم برای سایز بک گراند وجود دارد که می توانید آن ها را هم امتحان کنید:
background-size: cover;
background-size: 100% 100%;
برای مثال کد زیرتصویر بک گراند را کامل نمایش می دهد:
<div class="post" style='background:url("آدرس عکس") no-repeat center;background-size:contain' >
پاسخ به سوال