صفت grid-gap در css فاصله ردیف و ستون آیتم grid

صفت grid-gap در css فاصله ردیف و ستون آیتم grid

در این مقاله از سایت آموزی جهت استفاده شما همراهان گرامی قصد داریم در مورد خاصیت grid-gap در زبان css توضیحاتی را ارائه نماییم.

ویژگی grid-gap در سطح 1 زبان طراحی سی اس اس یعنی ماژول سی اس اس گرید سطح 1 معرفی شده است.

معرفی ویژگی کاربردی grid-gap در زبان طراحی سی اس اس

توسط خاصیت grid-gap می توانیم فاصله بین ردیف و ستون آیتم های گرید ( grade ) را مشخص نماییم.

خصوصیت کاربردی grid-gap در حقیقت مختصرنویسی 2 خصوصیت دیگر در سی اس اس گرید می باشد که عبارتند از:

خصوصیت grid-row-gap
خصوصیت grid-column-gap

مقادیر صفت کاربردی grid-gap در زبان طراحی سی اس اس

صفت کاربردی grid-gap که در ماژول سی اس اس گرید سطح 1 معرفی شده است، 2 مقدار می پذیرد که عبارت است از:

مقدار grid-row-gap
مقدار grid-column-gap

صفت grid-gap در css فاصله ردیف و ستون آیتم grid

مقدار grid-row-gap درون خاصیت grid-gap در زبان سی اس اس

اگر خاصیت grid-gap را برابر با مقدار grid-row-gap قرار دهیم، یعنی می خواهیم یک مقدار عددی اعم از rem و px و cm و % و … جهت تعیین فاصله بین ردیفی آیتم های grade ( گرید ) مشخص نماییم.

مثال براساس مقدار grid-row-gap برای خاصیت grid-gap

[html] div {grid-gap: 20px;} [/html]

مقدار grid-column-gap درون خاصیت grid-gap در زبان سی اس اس

اگر خاصیت grid-gap را برابر با مقدار grid-column-gap قرار دهیم، یعنی می خواهیم یک مقدار عددی اعم از rem و px و cm و % و … جهت تعیین فاصله بین ستونی آیتم های grade ( گرید ) مشخص نماییم.

مثال براساس مقدار grid-column-gap برای خاصیت grid-gap

[html] div {grid-gap: 20px;} [/html]

بررسی خاصیت grid-gap از نظر نسخه زبان طراحی سی اس اس

خصوصیت grid-gap در سطج 1 زبان طراحی سی اس اس یعنی ماژول CSS گرید سطح 1 معرفی شده است.

بررسی ساختاری خصوصیت grid-gap


عناوین ساختاری خاصیت grid-gap	وضعیت ساختاری خاصیت grid-gap
مقدار پیش فرض	0 0
قابلیت توارث	ندارد
قابلیت تحرک	دارد
ورژن css صفت	ماژول CSS گرید سطح 1
سینتکس صفت در جاوا اسکریپت	"object.style.gridGap="50px 100px