CSS داخل-بلاک-شروع

توصیه‌های دوره:

inset-block-start تعریف و استفاده

توجه:ویژگی برای مشخص کردن فاصله شروع بلوک عنصر نسبت به عنصر والد مشخص کنید. برای اینکه این ویژگی کار کند، باید مقدار آن را تنظیم کنید ویژگی position

ویژگی‌های CSS inset-inline و ویژگی inset-block ویژگی‌ها با ویژگی‌های CSS top،bottom،left و right بسیار مشابه هستند، اما ویژگی inset-block و inset-inline ویژگی وابسته به جهت بلوک و جهت خط است.

توجه:ویژگی‌های CSS مرتبط writing-mode تعریف جهت بلوک را مشخص می‌کند. این باعث تأثیر در مکان شروع و پایان بلوک و inset-block-start نتیجه ویژگی. برای صفحات انگلیسی، جهت بلوک به سمت پایین است و جهت خط به سمت چپ به راست است.

مثال

مثال 1

مقدار تنظیم شده برای فاصله شروع بلوک یک عنصر <div> قرار دارد:

div {
  inset-block-start: 50px;
}

آزمایش کنید

مثال 2

وقتی <div> عنصر... writing-mode وقتی مقدار ویژگی vertical-rl تنظیم شود، جهت بلوک از راست به چپ است. نتیجه این است که سرعت عنصر از بالا به سمت راست حرکت می‌کند:

div {
  inset-block-start: 50px;
  writing-mode: vertical-rl;
}

آزمایش کنید

آموزش زبان CSS

inset-block-start: auto|length|initial|inherit;

مقدار ویژگی

مقدار توضیح
آوتو مقدار پیش‌فرض. از فاصله پیش‌فرض inset عنصر استفاده می‌شود.
length

از واحد‌های ثابت (مانند px، pt، cm و غیره) برای مشخص کردن فاصله استفاده کنید. مقادیر منفی مجاز هستند.

لطفاً به:سی ایس ایس یونٹ.
% از درصد برای مشخص کردن فاصله استفاده کنید، که نسبت به اندازه عنصر والد در محور مربوطه است.
مقدار اولیه این ویژگی را به مقدار پیش‌فرض خود تنظیم کنید. ببینید: مقدار اولیه.
وراثت این ویژگی را از عنصر والد خود ارث می‌برد. ببینید: وراثت.

جزئیات فنی

مقدار پیش‌فرض: آوتو
وراثت: خیر
انیمیشن: پشتیبانی شده است. لطفاً به:ویژگی‌های مرتبط با انیمیشن.
نسخه: CSS3
آموزش زبان جاوااسکریپت: object.style.insetBlockStart="100px"

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

اعداد در جدول نشان‌دهنده نسخه اولین مرورگر پشتیبان از این ویژگی هستند.

کروم ایج فائرفاکس سرافی آپرا
87.0 87.0 63.0 14.1 73.0

مربوط پیج

تعلیم:CSS پوزیشن

مطالبه:CSS position کی اپریشن

مطالبه:CSS writing-mode کئیتی