跳到主要内容

inset-inline

2025年01月04日
柏拉文
越努力，越幸运

一、认识​

CSS 属性 inset-inline 定义了元素的逻辑行首和行末偏移，并根据元素的书写模式、行内方向和文本朝向对应至实体偏移。根据 writing-mode、direction 和 text-orientation 所定义的值，此属性对应于 top 和 bottom，或者 right 和 left 属性。

二、构成​

inset-inline 属性为下列 CSS 属性的简写属性：

  • inset-inline-end

  • inset-inline-start

三、语法​

/* 长度值 */
inset-inline: 3px 10px;
inset-inline: 2.4em 3em;
inset-inline: 10px; /* 应用于行首和行末 */

/* 包含块的宽度或高度的百分比 */
inset-inline: 10% 5%;

/* 关键词值 */
inset-inline: auto;

/* 全局值 */
inset-inline: inherit;
inset-inline: initial;
inset-inline: revert;
inset-inline: revert-layer;
inset-inline: unset;