سبد (0)

تبلیغات

خصوصیت box-pack

مثال (خصوصیت box-pack)

این مثال عناصر یک div را با استفاده از هر دو خاصیت های box-pack و box-align در مرکز div قرار می دهد:

div
{
width:350px;
height:100px;
border:1px solid black;

/* Internet Explorer 10 */
display:-ms-flexbox;
-ms-flex-pack:center;
-ms-flex-align:center;

/* Firefox */
display:-moz-box;
-moz-box-pack:center;
-moz-box-align:center;

/* Safari, Chrome, and Opera */
display:-webkit-box;
-webkit-box-pack:center;
-webkit-box-align:center;

/* W3C */
display:box;
box-pack:center;
box-align:center;
}
خودتان امتحان کنید »

پشتیبانی مرورگرها

Internet Explorer Firefox Opera Google Chrome Safari

هیچ یک از مرورگرهای اصلی، خصوصیت background را پشتیبانی نمی کنند.

مرورگر Internet Explorer10، خاصیت جایگزین ms-flex-pack- را پشتیبانی می کند.

مرورگر Firefox، خاصیت جایگزین moz-box-pack- را پشتیبانی می کند.

مرورگرهای Safari، Opera، Chrome خاصیت جایگزین webkit-box-pack- را پشتیبانی می کند.

توجه: box های انعطاف پذیر در مرورگرهای Internet Explorer 9 و نسخه های قدیمی تر آن پشتیبانی نمی شود.


تعریف و کاربرد

با استفاده از خاصیت box-pack می توان مشخص کرد که فرزندان یک box هنگامی که سایز box از سایز فرزندان بیشتر است در کجا قرار گیرند.

این خاصیت مکان عمودی را در box های عمودی، و مکان افقی را در box های افقی مشخص می کند.

مقدار پیشفرض start
ارث بری خیر
نسخه CSS3
JavaScript ساختار object.style.boxPack="center"

نحوه استفاده

box-pack: start|end|center|justify;
مقدارتوضیحاتنمایش دادن
start

برای boxهایی با جهت دهی نرمال، لبه سمت چپ اولین فرزند، در سمت راست قرار می گیرد، (فضای اضافی باقیمانده بعد از آخرین فرزند قرار می گیرد.) برای boxهایی با جهت دهی معکوس، لبه سمت راست آخرین فرزند، در سمت چپ قرار می گیرد، (فضای اضافی باقیمانده قبل از اولین فرزند قرار می گیرد.)

نمایش دادن »
end

برای boxهایی با جهت دهی نرمال، لبه سمت راست آخرین فرزند، در سمت راست قرار می گیرد، (فضای اضافی باقیمانده قبل از اولین فرزند قرار می گیرد.)  برای  boxهایی با جهت دهی معکوس، لبه سمت چپ اولین فرزند، در سمت چپ قرار می گیرد، (فضای اضافی باقیمانده قبل از اولین فرزند قرار می گیرد.)

نمایش دادن »
center

فضای اضافی به صورت مساوی تقسیم می شود، نیم از آن قبل از اولین فرزند و نیم دیگر بعد از آخرین فرزند قرار می گیرد.

نمایش دادن »
justify

فضای اضافی به طور مساوی بین فرزندان  تقسیم می شود (هیچ فضای اضافی قبل از اولین فرزند و بعد از آخرین فرزند وجود ندارد)

نمایش دادن »
تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehi مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی پرداخت آنلاین -  بانک ملت معرفی بیاموز در شبکه سه پرداخت آنلاین - بانک اقتصاد نوین پرداخت آنلاین - بانک سامان
 
دوره های آموزشی راه اندازی کسب و کارهای اینترنتی
تبلیغات اینترنتی