ویژگی inset-block-end CSS
- صفحه قبل inset-block
- صفحه بعدی inset-block-start
تعریف و استفاده
inset-block-end
ویژگی را تنظیم کنید تا فاصله انتهای عنصر در جهت بلوک با عنصر والد مشخص شود.
توجه:برای اینکه این ویژگی کار کند، باید ویژگی position
ویژگیها
CSS inset-inline
و inset-block
ویژگیها با ویژگیهای CSS top
،bottom
،left
و right
ویژگیها بسیار مشابه هستند، اما inset-block
و inset-inline
ویژگی وابسته به جهت بلوک و جهت خط است.
توجه:ویژگیهای CSS مرتبط writing-mode
تعریف میکند جهت بلوک. این اثرات را بر روی موقعیت شروع و پایان بلوک و inset-block-end
نتیجه ویژگی. برای صفحات انگلیسی، جهت بلوک به سمت پایین و جهت خط به سمت چپ است.
مثال
مثال 1
فاصله انتهای عنصر <div> قرارده شده در جهت بلوک با عنصر والد مشخص میشود:
div { inset-block-end: 50px; }
مثال 2
وقتی عنصر <div> writing-mode
وقتی ویژگی vertical-rl تنظیم شود، جهت بلوک از راست به چپ است. نتیجه این است که انتهای عنصر از پایین به سمت چپ حرکت میکند:
div { inset-block-end: 50px; writing-mode: vertical-rl; }
نویسهشناسی CSS
inset-block-end: auto|طول|مقدار اولیه|وارث;
مقدار ویژگی
مقدار | توضیح |
---|---|
자동 | مقدار پیشفرض. فاصله پیشفرض برای جایگذاری عنصر. |
طول | فاصله را بهصورت واحدهای px،pt،cm و غیره مشخص کنید. مقادیر منفی مجاز هستند. لطفاً به:واحدهای CSS. |
% | فاصلهای را بهصورت درصد نسبت به اندازه عنصر والد در محور مربوطه مشخص کنید. |
مقدار اولیه | این ویژگی را به مقدار پیشفرض خود تنظیم کنید. لطفاً به: مقدار اولیه. |
وارث | این ویژگی را از عنصر والد خود ارث میبرد. لطفاً به: وارث. |
جزئیات فنی
مقدار پیشفرض: | 자동 |
---|---|
وارثی: | خیر |
انیمیشنسازی: | پشتیبانی شده است. لطفاً به:ویژگیهای مرتبط با انیمیشن. |
نسخه: | CSS3 |
نویسهشناسی جاوااسکریپت: | object.style.insetBlockEnd="100px" |
پشتیبانی مرورگر
اعداد در جدول نشاندهنده نسخه مرورگر اولین بهروزرسانی شده برای این ویژگی هستند.
کروم | اندازهگیری | فایرفاکس | سفاری | опера |
---|---|---|---|---|
87.0 | 87.0 | 63.0 | 14.1 | 73.0 |
صفحات مرتبط
آموزش:محاسبه مکان CSS
منبع:ویژگی position CSS
- صفحه قبل inset-block
- صفحه بعدی inset-block-start